图片和行内块元素默认底线会和父级盒子的基线对齐，因此就会产生白色缝隙。
1.用vertical-align:middle | top| bottom等，让图片不和基线对齐。
上面3中对齐方式都可以
vertical-align不影响块级元素中的内容对齐，它只针对于行内元素或者行内块元素，特别是行内块元素， 通常用来控制图片/表单与文字的对齐。
2.将img通过display: block转为块级元素。
转为块级元素之后，就不存在和父级盒子基线对齐的问题了。
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：.sub{margin-top: 30px}。
3、浏览器运行index.html页面，此时3个div子子容器的垂直间距被统一设置为了30px。
