什么元素能感知浮动元素
浮动元素会脱离文档流
- 对于块级元素 / 行内块级元素 无法感知浮动元素，会占据浮动元素本来在标准流的位置，因此会被浮动元素覆盖
- 对于行内元素（span等）和文字能感知浮动元素，因此不受影响，会出现环绕效果。
浮动元素怎么确定位置
- 如果一个浮动元素前面没有元素，则以自身在标准流的位置浮动
- 如果前面的元素是块级且是标准流中的元素，则会保持相对垂直位置不变，则浮动元素的顶部与上一个块级元素的底部对齐
- 如果前面是浮动元素，则会跟在前面的元素的后边，除非这一行放不下两个元素，后面的元素被挤到下一行
div2、div4浮动
div3块级元素，被挡住了一部分
div4上面是div3，非浮动元素，保持相对垂直位置不变
div2、div3浮动
div4块级元素，无法感知浮动元素，上移被挡住
div3上一个元素是div2浮动元素，跟随在它后面
把div2、div3、div4都设置成右浮动
注意：div2最靠右
行内元素变成浮动元素
行内元素无法设置宽高，当变成浮动元素之后，设置宽高就起效了
清除浮动设置在哪一个元素上
假如页面中只有两个元素div1、div2，它们都是左浮动，场景如下：
这时候就要用到清除浮动（clear），在div1设置clear:right;，但是不起效
对于CSS的清除浮动(clear)，一定要牢记：这个规则只能影响使用清除的元素本身，不能影响其他元素。
所以想让div2移动，因此只要在div2的CSS样式中使用clear:left;来指定div2元素左边不允许出现浮动元素，这样div2就被迫下移一行。
实现一个三列布局的左右宽度固定，中间自适应。（使用浮动解决）
由于排成一列，那么浮动元素肯定不能在块级元素后面，因此块级元素即排在中间的元素要设置在浮动元素后面。
中间自适应，则不用设置width
左右列元素设置浮动来实现，设置宽度
中间元素防止被当作则设置margin，左右外边距为浮动元素的宽度
