清除浮动（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>