CSS中清除浮動的屬性是很常用的,可以使得頁面布局更加合理,下面介紹幾種常用的清除浮動屬性。
.clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; }
上述代碼使用的是:before和:after這兩個偽元素來清除浮動。通過display:table將偽元素變為行內框架,然后在偽元素后加上clear:both來清除浮動,使得外圍元素可以包含內部浮動元素。
.clear { clear: both; }
上述代碼使用的是clear屬性,將元素的float屬性清除掉,來防止浮動元素影響布局。使用時只需要在需要清除浮動的元素上加上該類名即可。
.container::after { content: ""; clear: both; display: block; }
上述代碼使用的是CSS3選擇器::after,在容器元素的尾部插入一個空元素,然后使用clear:both清除浮動。
以上介紹的是三種常用的清除浮動屬性,根據不同的場景選擇不同的屬性清除浮動即可。
上一篇mysql 高級子查詢
下一篇div css自適應右