为什么会出现浮动?浮动会带来哪些问题?清除浮动的方式有哪些?哪种较好?

为什么会出现浮动?浮动会带来哪些问题?清除浮动的方式有哪些?哪种较好?

浮动产生的原因:

01-需要块级元素处于一行

02-需要文字环绕在图片周围

浮动带来的问题:

1. 父元素的高度无法被撑开,影响与父元素同级的元素

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

3. 如果当前元素浮动会影响后面元素,那么后面元素也得浮动(或者需要清除浮动)

清除浮动的方式:

1. 父级div定义height

2. 父级div定义overflow:hidden

3. 父级div定义overflow:auto。

4. 结尾处加空div标签clear:both

5. 结尾处加br标签clear:both

6. 父级div定义伪类:after、before

7. 父级div也浮动,需要定义宽度。

8. 父级div定义display:table。

哪种较好: 伪类元素清除浮动

比较好的是第6种,无需多余标签,方便维护,通过伪类就可以解决

相关阅读

C罗世界杯进了几个球了 此前共参加过几次世界杯
365最专业的数据服务平台

C罗世界杯进了几个球了 此前共参加过几次世界杯

📅 07-03 👁️ 3904
数据预处理-分箱(Binning)和 WOE编码
365最专业的数据服务平台

数据预处理-分箱(Binning)和 WOE编码

📅 07-05 👁️ 1580
姆巴佩回归  皇马在世俱杯比赛中击败尤文图斯
det365官网登录

姆巴佩回归 皇马在世俱杯比赛中击败尤文图斯

📅 07-02 👁️ 7565