元素浮动后的特点
- 脱离文档流
- 不管浮动前是什么元素,浮动后:默认宽与高都是被内容撑开(尽可能小),并且可以设置宽高
- 不会独占一行,可以与其他元素共用一行
- 不会像margin合并,也不会塌陷,能完美设置四个方向的margin和padding
- 不会像行内块一样被文本处理(没有行内块的空白问题)
解决浮动产生的影响
- 给父元素指定高度
- 给父元素设置浮动,带来其他影响
- 给父元素设置
overflow:hidden - 给所有浮动元素的最后面,添加一个块级元素,并给块级元素设置
clear:both - 给浮动的父元素,设置伪元素,通过伪元素清除浮动,原理与方案四相同
浮动原则:要么全部浮动,要不全都不浮动