首頁 > web前端 > css教學 > CSS中清除浮動的最好用的方法之一的詳細介紹(附程式碼)

CSS中清除浮動的最好用的方法之一的詳細介紹(附程式碼)

不言
發布: 2018-08-10 17:44:32
原創
1518 人瀏覽過

這篇文章給大家分享的內容是關於CSS中清除浮動的最好用的方法之一的詳細介紹(附代碼),有一定的參考價值,有需要的朋友可以參考一下,希望對你有所幫助。

我們寫網頁常常為浮動帶來的影響而煩惱,因為子元素浮動導致父元素沒有高,從而網頁錯亂,達不到自己想要的結果。
清除浮動,我只推薦這個方法!
下面這個方法是我從學前端用到現在的,也沒想換過,因為太好用了:

.clearfix:after{    
content: "";    
height:0;    
line-height: 0;    
display:block;    
visibility: hidden;    
clear:both;}
登入後複製

具體用法:

<ul class="clearfix">
    <li style="float:left;"></li>
    <li style="float:left;"></li>
    <li style="float:left;"></li>
    <li style="float:left;"></li></ul>
登入後複製

子元素浮動了,為父元素加上這個類別即可,百試不爽!

因為這個樣式常用,建議加到公共樣式裡面去哦!

相關推薦:

html和css結合實作手機端網頁自適應的程式碼

html中對於存取服務端的方法分析(圖文)

#

以上是CSS中清除浮動的最好用的方法之一的詳細介紹(附程式碼)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板