在前端開發中，清除浮動的方法有多種，開發人員可以根據自己的喜好選擇不同的方式。
1、將設定float的元素的父元素也設定float。
父元素也設定浮動，侷限性較大。
2、設定父元素的overflow為hidden。
3、設定父元素的display為inline-block。
缺點：可能不符合情況要求。
4、浮動元素的下方加入空的div元素，並新增屬性：clear:both.
5、使用after偽類（內容生成，此方法同上）
some:after{
content:」.」;
height:0;
visibility:hidden;
display:block;
clear:both;
id="header_right">
id="header_right_1">
href="">登入a>
span>
li>
href="">註冊a>
span>
li>
href="">訊息通知a>
span>
li>
id="gwc">
id='header_right_gwc'>購物車(0)a>
id="warning_cart" >
您的購物車中還沒有商品,趕緊選購吧!
div>
li>
ul>
div>
並且css中設定了相應的樣式，以上所有元素均是浮動。並且#warning_cart的寬和高都超越了其父元素#gwc，這種情況下，不清除浮動，會導致元素偏離原位，無法實現相應的效果。
解決辦法：設定其父元素的寬度和高度，#warning_cart浮動時就自動下移，不會影響兄弟元素和父元素的布局。此時元素是溢位情況，會影響後續元素的定位，所以需要進行絕對定位，fixed。
浮動布局所帶來的影響以及如何清除浮動
在頁面的布局過程中浮動是個好東西，我們經常會用到浮動布局，它可以使元素共享一行，極大的方便了我們的布局過程。但是很多人可能只是會用，對浮動的原理只是一知半解，如果沒有清晰的認識到浮動所帶來的影響以及如何清除浮動所帶來的影響，那麼面對 量龐大的頁面將會變得一頭霧水。所以接下來我們來深入學習一下浮動布局...
css中浮動和清除浮動帶來的影響
有很多時候，我們都會用到浮動，而我們有時候對浮動只是一知半解，卻不是太清楚它到底是怎麼回事，不知道各位有沒有和我一樣的感覺，只知道用它，卻不知道它到底是怎麼回事，所以，在學習的過程中，就要把乙個概念不是很清晰的問題把它弄清楚了，便於我們以後的使用。早些時候，w3c規定出來的浮動實際並不是為了布局所用...
css清除浮動帶來的負面影響
來看乙個實驗 現在有兩個div，div身上沒有任何屬性。每個div中都有li，這些li都是浮動的。我們本以為這些li，會分為兩排，但是，第二組中的第1個li，去貼靠第一組中的最後乙個li了。第二個div中的li，去貼第乙個div中最後乙個li的邊了。原因就是因為div沒有高度，不能給自己浮動的孩子們...