CSS定位

div分层

从上到下依次分为：

• 内联子元素
• 浮动元素 脱离文档流
• 块级子元素 块级元素若文字出现重叠的情况，是以文字出现的先后顺序进行覆盖
• border
• background

新属性-position

属性值：

• static默认值，待在文档流里。
• relative相对定位，升起来，但不脱离文档流
• absolute绝对定位，定位基准是祖先里的非static 比如关闭按钮 注意：使用absolute，其父元素需要加relative
  备注：元素会被移出正常文档流，并不为元素预留空间，通过指定元素相对于最近的非 static 定位祖先元素的偏移，来确定元素位置。
• fixed固定定位，定位基准是viewport 手机上尽量不要使用这个属性
  元素会被移出正常文档流，并不为元素预留空间，而是通过指定元素相对于屏幕视口（viewport）的位置来指定元素位置。
• sticky粘滞定位

默认每个元素的z-index是auto，而auto计算出来的值为0.
white-space：nowrap； --文字内容不准换行

层叠上下文

层叠上下文形成条件（需要记忆）：

• 根元素（html）
• z-index不为auto的绝对/相对定位
• opacity属性小于1的元素
• transform的值不为none的元素
• 一个z-index值不为auto的flex项目，即父元素 display：flex；
• 固定定位元素和sticky定位元素