浮动布局

• 块状元素会视浮动元素不存在，行内元素会绕着浮动元素渲染。前者是浮动元素可以看成脱离文档流，后者看成仍在文档流中。
• 元素被浮动时会生成块框则为block，当他们与元素重叠时，他会盖在块状元素上，行内元素会盖在浮动元素上。
• 浮动元素位置：他会尽可能的在左右俩边和上边。但他不会超过他的包含块（包含块在常规流中就为父元素的content-box），不会超过他的父元素，行框，上边的块状元素。当他和定位一起使用时，定位生效。

清除浮动

• 清除浮动：是指块框像下移避开上面的浮动元素。clear：left/right/both，是移动的border-box紧贴上一个浮动元素的margin-box。设置移动的这个元素的margin无效。
• 闭合浮动：是改变浮动元素的父元素状态使他不会影响下面的元素，包含浮动元素

1. 设置父元素高度（一般不采用，不知道里面浮动元素的高度）
2. 触发元素的BFC（里面的元素不会影响外面，外面的元素不会影响里面）：有父元素overflow:hidden，display：flow-root，让父元素也设置浮动，包含块变成表格，设置父元素为行内块元素
3. 在元素后面写一个行内元素，让其宽度为100%会独立显示，撑大父元素（会有一行空隙清除不了）
4. 在浮动元素之下写一个0高的块状元素，但是让其在浮动元素之下要用clear：both，可以用一个类名为clearfix的伪类元素清除。

运用浮动布局

词典，中间自适应俩边定宽

1. 元素浮动之后不会超过前面的块状元素，需要让右边的元素写在前面
2. 元素浮动之后中间的宽度仍然为100%，但是浮动元素盖在其上面，可以设置margin的值。
3. 常规流的块状元素触发他的BFC通过让自己变窄来避开浮动元素。overflow:hodden，display:flow-root

多列等高中间自适应布局

1. 首先先闭合最大的父元素div，不让浮动元素跑到外面
2. 选中里面的所有标签，增加他们的padding-bottom，然而最下面的元素依然在下面，加快他们的结束的位子，，margin-bottom为负值。当值同样的时，父元素就在最下面的元素的长度了，只是到了最下面的结束位置，其余的位置还没到。