overflow:hidden的作用

1、溢出隐藏作用：

见：css溢出属性：overflow属性介绍_陌一一的博客-CSDN博客_cssoverflow属性

2、清除浮动

看下面代码：

代码中图片设置了浮动，浮动的原理是让图片浮动起来，这样的话就造成图片脱离了文档流，此时就没有了高度；

如果说图片下面还有别的标签，那此时这些标签就会跑上来，跑到原来图片的文字，在图片下面显示；

那如果下面的标签是图片呢，但是我们又想让图片依次向下显示：如图：

不清除浮动就会像下面这样:

 所以要加：此时overflow：hidden的作用就是清除浮动： 让图片不脱离文档流，有高度的占位；

 代码：

li{
    overflow: hidden;
}
li img{
    float: left;
}