九、定位

1、定位

position定位，用来改变页面中元素的位置

1，相对定位

relative;

相对定位的元素框会偏移某个距离。元素仍然保持其未定位前的形状，它原本所占的空间仍保留。

可以通过“left”, “top”, “right” 以及 “bottom” 或者px 百分比规定位置

特点：

1.不使元素脱离文档流；
2.不影响元素本身的特性
3.如果没有定位偏移量，对元素本身没有任何影响

2、绝对定位

absolute;

1.相对于已经定位的父元素进行定位
2.如果没有定位偏移量，对元素本身没有任何影响

3.可以通过“left”, “top”, “right” 以及 “bottom” 或者px 百分比规定位置

特点：

1.完全脱离文档流
2.行内元素支持宽高
3.块级元素内容撑开宽高
4.没有祖先元素则相对于body
5.一般配合相对定位使用
6.绝对定位的元素的位置相对于最近的已定位祖先元素
7.margin:auto;失效

3、固定定位

fixed;

• 相对浏览器窗口定位

• 与绝对定位特性一致

4、层级关系

z-index;

• z-index 可以调换两个层的上下位置关系
  值可以为正，也可以为负，值越大，越在上面 默认值=0 只能同级元素对比！
• z-index:只对定位的元素有效，其它元素均无效