两个img标签之间有空白

偶尔会遇到这种情况
两个图片自下而上排列
会发现中间有一个空白
这个时候会怀疑是不是图片有白边
仔细查看图片，是没有白边的
那问题在哪里呢？

先说解决方案：
1.给图片增加样式display：block
2.img{vertical-align:top;}
改变其垂直对齐方式
3.div{font-size:0};
把父元素的文字大小设置为0
4.div{ margin-bottom:-3px };
这个方法不推荐
img标签
根本原因在于img标签为inline元素，该元素默认垂直对齐方式为以父元素的baseline，但是展示时又是以bottomline为对齐方式，因此造成了上下两个img标签之间的间隙。