CSS position 属性
实例定位
h2 元素:
h2 { position:absolute;
left:100px;
top:150px; }
在上例中,left:100px 表示距离元素的原始左侧位置为100 像素(即向右移动了100px)
top:150px表示距离元素的原始上边位置为150px(即向下移动了150px)
注:这些值可以取负数,如left:-20px,它表示距离元素的原始左侧位置为-20像素(即向左移动了20px)
其中absolute和fixed的区别:
fixed相当于固定在浏览器的窗口的某个位置,无论屏幕怎么滚动,它在屏幕的位置不会改变
absolute是想对于其包含块定位,它随屏幕滚动
relative和absolute的区别
两者都是按相同的方法移动位置
relative 原本所占的空间仍保留。
absolute 元素框从文档流完全删除,就好像原来的元素不存在一样
在position属性中相对定位,绝对定位,固定定位的值可以接受长度值(em,px等),也可以接受百分比值
z-index必须在position中才能发挥作用,单独使用是不能发挥作用的
其中z-index:0是默认值z-index的值可以是正数,也可以是负数
如:Z-index: 1 拥有更高的优先级
Z-index :-1 拥有更低的优先级
z-index的值越大,拥有的优先权越高CSS
绝对定位绝对定位使元素的位置与文档流无关,绝对定位的元素的位置相对于最近的已定位祖先元素,如果元素没有已定位的祖先元素,那么它的位置相对于最初的包含块。