以前清除浮動的時候總是在想要清除浮動的元素后面添加

或者寫在br標簽里面來解決，但這樣會增加無語義的標簽，下面是用after偽類實現，兼容多種瀏覽器

.clearfix:after{

content:"";

display:block;

height:0;

clear:both;

visibility:hidden;

}

為兼容IE6,IE7，因為ie6,ie7不能用after偽類。加上下面代碼

.clearfix{zoom:1}

一般情況下，如果父層內部有浮動(float)可能導致父層的高度為0，加上clearfix后就行了

HTML：

leftright

CSS:

.clearfix{zoom:1}

.clearfix:after{

content:"";

display:block;

height:0;

clear:both;

visibility:hidden;

}

.parent{

background-color:red;

width:120px;

}

.left{

float:left;

background-color:pink;

height:60px;

}

.right{

float:right;

background-color:#abcdef;

}

以上所述是小編給大家介紹的使用 after 偽類清除浮動實例，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！

總結

以上是生活随笔為你收集整理的html怎么使用伪类清除浮动,JS中使用 after 伪类清除浮动实例的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。