为什么会出现浮动?浮动元素会引起什么问题?如何清除浮动?

209 阅读1分钟

浮动将元素排除在普通流之外,即元素将脱离文档流,不占据空间。浮动元素碰到包含它的 边界或者浮动元素的边界停留

为什么需要清除浮动

1、子元素浮动后,不占位置,父元素的高度无法被撑开,影响与父元素同级的元素;

2、与浮动元素同级的非浮动元素(内联元素)会跟随其后;

3、若非第一个元素浮动,则该元素之前的元素也需要浮动,否则会影响页面显示的结构解 决方法

清除浮动的方式

1、使用 CSS 中的 clear:both;(放一个空的标签,并设置上述 css,注意该标签必须是块 元素),属性来清除元素的浮动

2、给父元素添加 clearfix 样式:

3、给父级元素设置双伪元素