清除浮動（css）

1. 浮動會讓子元素脫離文檔流，使得父級元素看不見自己。
2. clear:both清除浮動，讓父元素可以自動獲取到高度
3. 但是在父元素的末尾加上一個空的盒子，雖然看不見其他的，但是能看到最後的那個，所以高度也能確定，而又不影響其他元素的佈局（空的）

方法一：

.clearfix1:after {
     content: "";
     display: block;
     clear: both;
}

    <ul class="clearfix1">
        <li><img src="1.jpg" alt=""></li>
        <li><img src="2.jpg" alt=""></li>
        <li><img src="3.jpg" alt=""></li>
        <li><img src="4.jpg" alt=""></li>
    </ul>

方法二：

.clearfix2 {
     content: ""; 
     display: block; 
     clear: both;
}

    <ul>
        <li><img src="2.jpg" alt=""></li>
        <li><img src="2.jpg" alt=""></li>
        <li><img src="3.jpg" alt=""></li>
        <li><img src="4.jpg" alt=""></li>
        <div class="clearfix2"></div>
    </ul>