各元素的层级关系
从上到下依次为
- 内联子元素
- 浮动元素
- 块级子元素
- border
- background
文字内容的层级后出现的较高。
position 定位
position: static; 默认值。
position: absolute; 绝对定位。
position: relative; 相对定位。
position: fixed; 固定定位，相对于视口，手机上尽量不要用。
position: sticky; 粘性定位，兼容性差。
z-index默认是 auto，谁的数值大。谁在上面。
white-space: nowrap; 文字内容不准换行。
absolute 会相对最近的非 static 祖先元素定位。
z-index: auto; 不创建层叠上下文。
z-index: 0; 会创建层叠上下。
opacity 会影响整个元素。
background: rgba 只会影响背景。
创建层叠上下文
z-index: 0;position: fixed;- opacity 不为 1
- transform 不为 null
详情阅读MDN文档
资料来源：饥人谷，MDN
网友评论