参加过前端培训或者是自学前端技术的同学一定都遇到过这样的事情，就是在我们前端页面添加图片的时候会在图片下方出现几像素的空白间隙，那是怎么造成的呢，可能刚参加前端培训的学员不知道原因，尤其是初学的自学者更加比较迷茫，其实这是由于img默认是按照基线(baseline)对齐导致的。
方法1：
img{display:block;}
方法2：
img{vertical-align:top;}
除了top值，还可以设置为text-top | middle | bottom | text-bottom，甚至特定的<length>和<percentage>值都可以
方法3：
给 img的父级 添加:font-size: 0; line-height: 0;
这三种方法都是可以很好的解决图片下方出现几像素的空白间隙，大家用哪一种方法都是可以的，一般在前端培训的过程中前端培训老师也都会提及这些方法，自学的同学也可在网上搜索找到相关的解决办法。
上一篇: 前端培训技术之如何让超链接访问后和访问前的颜色不同且访问后仍保留hover和active效果
下一篇: 大数据技术如何学习，这些技巧不能少
