CSS之定位和堆叠属性

CSS之定位:

定位有：

1. 绝对定位
2. 相对定位
3. 固定定位

绝对定位：

属性：position属性值：absolute

相对定位：

属性：position属性值：relative

相对元素是相对于在页面中原来的位置，如果给了元素一个相对定位那么元素在页面中原来的位置会占位。

固定定位：

属性：position属性值：fixed

固定定位是元素相对于浏览器窗口的定位

一般情况下，相对定位和绝对定位在页面中是成对使用的，给子元素一个x绝对定位给父元素一个相对定位。

特征：

如果给行内元素一个绝对定位那么这个行内元素可以设置宽高，如果给块元素一个绝对定位并且这个块元素还没有设置宽高，那么他的宽高是由内容撑起的 如果子元素有绝对定位那么不受父元素padding的影响。 如果子元素有浮动，父元素有绝对定位那么不用清楚浮动。

堆叠属性：

属性：z-index属性值：1~x（属性值是数值)

在页面中如果一个元素的堆叠属性的属性值大，那么这个属性值大的会堆叠在属性值小的上边，属性值没有单位。堆叠属性只能用在含有定位属性的元素上。

转载于:https://juejin.im/post/5cd7b9c4f265da036706c79b