ul高度为0 li高度为0

当一个元素只包含浮动元素的时候，它会出现高度折叠，即元素的上下底边重合，和高度为0效果一样，为了解决这种情况，需要清除浮动。

 

方法一  在最后一个li后面添加一个标签div,并且设置style=”clear:both;”

 

方法二  利用伪元素:after,给ul清除浮动  

 

 :before 和 :after 的主要作用是在元素内容前后加上指定内容

ul:after{
    content: "";
    display: block;
    clear: both;
}