<div style="background:blue; overflow:hidden;"> <div style="width:100px; height:100px; background:red; float:left;"></div></div>
Salin selepas log masuk
一直没想明白为什么使用overflow:hidden可以清除浮动呢？这是什么原理啊？
另外这种方法是不是在IE9里不行了？我刚才试了下，不行。但在火狐里还可以。
回复讨论(解决方案)
没发觉能清除
没发觉能清除
可是我从网上看的教学视频，他里面讲的清除float有两种办法：1、clear 2、overflow:hidden;
而且在他那确实清除成功了，但在我这（IE9）不行。
为什么必须得给父DIV赋高呢？
另外用over:hidden消除浮动是什么原理啊？
<div style="background:#06F; overflow:hidden;"> <div style="height:50px; width:100px; float:left; background:#F00;"></div> <div style="height:100px; width:100px; background:#F0F;"></div> </div>
Salin selepas log masuk
你这样写的时候你测试一下，并没有清除浮动啊？
HTML code
<div style="background:blue;"> <div style="width:100px; height:100px; background:red; float:left;"></div></div>
Salin selepas log masuk
加了over:hidden是这样的效果：
<div style="background:blue; overflow:hidden;"> <div style="width:100px; height:100px; background:red; float:left;"></div></div>
Salin selepas log masuk
我所说的清除浮动，不是对后面元素的影响，是消除了对父元素的影响。
我的问题是，为什么over:hidden会实现这样的效果？
谢谢！
只知道对该div有溢出隐藏功能 至于浮动清除浮动 没发觉
算了我再开个帖子吧
说一下个人理解：
div不指定width和height时，默认width为0，height为100%；
不加overflow:hidden时，子div受float影响脱离父div的束缚，父div默认没有高度，自然就是第一个图的效果；
加上overflow：hidden时，所谓消除了浮动，那么子div自然就要使父div的高度为100px、宽度默认100%
实际上，overflow：hidden影响的只是垂直空间上的浮动，并不影响水平面上的浮动，将float设置为right可以看得更加明白。（仅仅是个人理解，不知道正确不。。。。。。）
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
