網站自適應之清除標簽的float浮動

編輯：狂族晨曦 來源：經驗雜筆 日期：2016-04-09 閱讀： 2,456 次 2 條評論 » 百度已收錄

Float是我們在設計網站前端的時候，很常用到的一個CSS屬性。我們常用它來讓DIV等標簽貼向左邊或者右邊。關于Float的用法，大家可以去看看w3school的介紹：

• w3school：CSS float 屬性

其實Float共有4個用法，我們常用的方法是設置是下面這兩種：

float:left;
float:right;

我們在設置不同分辨率CSS樣式的時候，可以用float的right來替換left以達到某些設計上的要求，但是我們的要求是多變的。

先森在適配網站自適應的時候，就遇到了設置了左右浮動的標簽，在更小分辨率想要將其設置為居中的狀態的時候設置不成功的情況，這時先森就想讓它的浮動效果清除掉。

清除左右浮動其實也很簡單，上文說了Float共有4個用法，除了常用的左右浮動，還有兩個用法分別是"none"和"inherit"。從字面意思上就可以看出它們的用法，分別是“沒有”和“繼承”。

在我們想要將其浮動清除的時候，只需要設置以下屬性即可：

float:none;

關于Float的浮動，清除起來還是比較容易。但是關于定位的屬性position的定位，如何清除它的影響先森還是沒能琢磨的透。網上提出的有兩種解決方法，一個是overflow，另一個是clear:both，只能看哪個有用設置哪個了。

網站自適應之清除標簽的float浮動