宏觀地講，我們的web頁面的制作，是個“流”，必須從上而下，像“織毛衣”。
標准流里面的限制非常多，導致很多頁面效果無法實現。如果我們現在就要並排、並且就要設置寬高，那該怎么辦呢？辦法是：超脫！脫離標准流！
浮動是css里面布局用的最多的屬性。
現在有兩個div，分別設置寬高。我們知道，它們的效果如下：
此時，如果給這兩個div增加一個浮動屬性，比如float: left;，效果如下：
這就達到了浮動的效果。此時，兩個元素並排了。（這在標准流中，不能實現）。
浮動想學好，一定要知道四個性質。接下來講一講。
性質1：浮動的元素脫標
脫標即脫離標准流。我們來看一個例子。
上圖中，在默認情況下，兩個div標簽是上下進行排列的。現在由於float屬性讓上圖中的第一個<div>標簽出現了浮動，於是這個標簽在另外一個層面上進行排列。而第二個<div>還在自己的層面上遵從標准流進行排列。
性質2：浮動的元素互相貼靠
我們來看一個例子就明白了。
我們給三個div均設置了float: left;屬性之后，然后設置寬高。可以看到div的貼靠效果：
性質3：浮動的元素有“字圍”效果
來看一張圖就明白了。我們讓div浮動，p不浮動
上圖中，我們發現：div擋住了p，但不會擋住p中的文字，形成“字圍”效果。
性質4：收縮
收縮：一個浮動的元素，如果沒有設置寬高，那么將自動收縮為內容的寬高（這點非常像行內元素）。
div設置寬高：
div不設置寬高：
上圖中，div本身是塊級元素，如果不設置widh，它會單獨霸占整行；但是，設置div浮動后，它會收縮
至此，在單獨使用浮動時的一些特點就結束啦！！！當然，實際開發時，更多是浮動后帶來的問題，我們下次再細說。
【逆戰】