div包裹img底边会有几个像素的空白的问题

在写代码的时候经常遇到这样一个问题，如果div里嵌套一个img元素且div的高度是由img的高度来撑开，那么div的高度总会比img的高度多几个像素，如图1 这是图像的自然行为，因为img是内联元素，所以浏览器为下行字符留下一些空间。 为了理解刚刚发生的事情，我们来看一下线框的构造，线框内图像的放置以及线框在表格单元格中的放置。首先是一个包含文本的基本线框，如图2所示。 图2中最关键的部分是基线（

>>阅读原文<<