设浮动后,怎样清除浮动?

发布网友发布时间：2022-04-28 08:33

我来回答

共3个回答

懂视网时间：2022-04-28 12:54

容器元素闭合标签前添加额外元素并设置clear: both

父元素触发块级格式化上下文

块级格式化上下文，它是一个独立的渲染区域，这个区域与外部毫不相干。

触发条件：

根元素（例如：html）

元素浮动了（float 不为 none）

position 为 absolute 或 fixed

display 为 inline-block、table-sell、flex…

overflow 不为 visible

设置容器元素伪元素进行清理（推荐的清理浮动方法）

推荐学习：《前端视频》

热心网友时间：2022-04-28 10:02

1.清除浮动的div默认是不会有高度的，除非你设置了高度。在编辑窗口中，是软件给你展示有一个div的存在而显示的，代码中依然没有改变本质。

2.如果想以类似<div class="clear:both"></div>这种形式清除浮动的话，那你最好将此div放置在有浮动属性的同级元素后面（比如对于你的代码就是li。不过ul的下一级元素只能是li，所以你可以写成这样：<li style="clear:both;height:0; visibility:hidden"></li>）；如果用overflow:auto这种方式，那么这个设置应该放在具有浮动属性元素的父容器中（如你的ul），而且这种方式是可以清除在非ie及ie7+浏览器中的浮动，对ie6无效，那么设置中应该多写上zoom:1等；还有就是伪对象的使用（:after）。有关清除浮动的方式、还有浮动的本质网上有很多详释，希望你能认真的看下。多理解，那么你才会真正理解其内在，才好驾驭。

热心网友时间：2022-04-28 11:20

给你的第一个DIV中的ul设置宽度并且加上这个CSS属性即可解决“overflow:auto;”。