这种方法有一个问题：margin失效。
<p class="box1">
</p>
<p class="cl hl"></p> /*墙*/
<p class="box2">
</p> cl{
clear: both;
}
.hl{
height: 16px;
}<p>
<p></p>
<p></p> /*两个p都浮动，所以p不会被撑出高*/
<p class="cl"></p> /*在家里建一堵墙就能让儿子给p撑出高*/
</p>注意：一般不使用此方法，会增加页面标签。
本意就是清除溢出到盒子外面的文字。但是，它能作为偏方来清除浮动。
注意：一般不使用此方法，因为溢出这个元素所在的区域会被隐藏。
.clearfix:after {
content: '';
height: 0;
line-height: 0; /*或 overflow:hidden*/
display: block;
visibility: hidden;
clear: both;
}
.clearfix {
zoom: 1; /*兼容ie6*/
}页面上不存在的元素可以通过css添加上去，每个元素都有自己的伪元素。
.clearfix:before,.clearfix:after {
content: '';
display: table;
}
.clearfix:after {
clear: both;
}
.clearfix {
zoom: 1;
}以上就是CSS中清除浮动的几种方法的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
435
收藏
