我在浮动的div容器中有一个图像：
<div><img src="..." /></div>
然而，容器总是比它里面的图像高几个像素，这是相当丑陋的see in this fiddle。当然，粉红色区域有点夸张，但它清楚地表明了问题。
有没有办法避免这种情况？即如果只有容器中的图像，它不应该在图像下方有任何空白。填充和边距已经为零，因此不是导致问题的原因。
答案 0 :(得分：5)
结帐Images, Tables, and Mysterious Gaps on MDN。图像是内联的并且位于基线上。下面的空格是为文本中的下降者保留的。
将图像设置为display: block将解决您的问题，尽管前面提到的文章是一个很好的阅读。
答案 1 :(得分：0)
这对我有用。
img { vertical-align: top; }