css浮动

1. 浮动最典型应用：可以让多个块级元素一行内排列显示
2. 网络布局第一准则：多个块级元素纵向排列找标准流，多个块级元素横向排列找浮动
3. float语法：选择器{float：none/left/right；}
4. 浮动特性：（1）脱标：脱离标准流的控制（浮）移动到指定位置（动）

       （2）浮动的盒子不再保留原先的位置

 

（3）如果给多个盒子设置浮动，则它们会按照属性值一行内显示并且顶端对齐排列

（4）浮动元素会具有行内块元素相似特性：任何元素都可以浮动，不管原先是什么模式的元素，添加浮动之后具有行内块元素相似的特性。

5.浮动元素经常和标准流父级搭配使用： 先用标准流父元素排列上下位置，之后内部采取浮动排列左右位置

6.清除浮动：选择器{clear：left/right/both；}

7.清除浮动的策略：闭合浮动。只让浮动在父盒子内部影响，不影响父盒子外面的其他盒子

8.清除浮动的方法：（1）额外标签法（隔墙法）：在浮动元素末尾添加一个空标签(要求这个新标签必须是块级元素)。例如：<div style=“clear：both”>

（2）父级添加overflow属性：将其属性值设置为hidden、auto或scoll

（3）父级添加after伪元素：

（相当于在浮动元素后放一个盒子）

（4）父级添加双伪元素：

（在前后分别放一个盒子）