分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 运营维护

浅谈 css 之 position用法

发布时间:2023-09-06 01:06责任编辑:沈小雨关键词:暂无标签

  在 css中, position 属性有四个值可用: static(默认值)、absolute、relative、fixed。

  relative:相对定位(相对于自身进行在常规流中的位置进行定位,保留自身原始的位置)

  absolite:

    1、相对于自身的包含块定位;
    2、寻找包含块的规则:从自身网上寻找祖先元素,寻找到的第一个position为非static修饰的祖先元素的内边距边界 就是当前绝对定位元素的包含块;如果没有的话,则相对于 html进行定位;
    3、完全脱离文档流;
    4、display的取值更改为inline-block;
    5、不缩短行框

  fixed:

    完全脱离文档流,和 absolute 的唯一的区别就在于:absolute元素是根据最近的定位上下文确定位置,而fixed永远根据浏览器确定位置。即使窗口是滚动的它也不会移动 

  说到 position,就要再说一下 [Z-index] (垂直定位)

  Z-index 默认值为0;这种情况下,后者会覆盖前者,需要改变元素之间层级关系的话,就要通过改变 Z-index 值来实现了,Z-index值越大优先级就越高。

浅谈 css 之 position用法

原文地址:http://www.cnblogs.com/kcsjm/p/7440084.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved