定位

1. 与浮动元素同级的非浮动元素会紧随其后

清除浮动

1. 父级div定义height
2. 最后一个浮动元素加空div标签，添加样式clear:both（不推荐）
3. 父级div定义zoom
4. 父级添加overflow：hidden/auto（不推荐）
5. 浮动元素的容器添加浮动（不推荐，会使整体浮动，影响布局）
6. after伪元素清除浮动，尾部添加一个看不见的块元素清理浮动，设置clear:both（推荐）
7. before和after双伪元素清除浮动

总结 3 种

1、clear属性

2、BFC

3、::after伪元素

定位

1. relative：相对自身之前正常文档流中的位置发生偏移，与世隔绝，且原来的位置仍然被占据。发生偏移时，

可能覆盖其他元素。body默认是relative,子绝父相。

1. absolute：元素框不再占有文档位置，并且相对于包含块进行偏移（所谓包含块就是最近一级外层元素

position不为static的元素）。

1. fixed：元素框不再占有文档流位置，并且相对于视窗进行定位。
2. static：默认值，取消继承。
3. sticky：css3新增属性值，粘性定位，相当于relative和fixed的混合。最初会被当作是relative，相对原来位置

进行偏移；一旦超过一定的阈值，会被当成fixed定位，相对于视口定位。

1. inherit

文档流

定位流

元素的属性 position 为 absolute 或 fixed，它就是一个绝对定位元素。

在绝对定位布局中，元素会整体脱离普通流，因此绝对定位元素不会对其兄弟元素造成影响，而元素具体的位置由绝对定位的坐标决定。

它的定位相对于它的包含块，相关CSS属性：top、bottom、left、right；

对于 position: absolute，元素定位将相对于上级元素中最近的一个relative、fixed、absolute，如果没有则相对于body；

对于 position:fixed，正常来说是相对于浏览器窗口定位的，但是当元素祖先的 transform 属性非 none 时，会相对于该祖先进行定位。