默认情况下图像底部的5px边距/边框/填充？

Question

我一直在试图让8张图片坐在一起，没有间隙。通常这是一项非常简单的任务，但由于某种原因，我无法弄清楚这里发生了什么。

我把代码缩减到了最简单的代码，但是我不能为了我的生活找出为什么这个例子产生了一个5px的空白background: red。任何人？

Codepen：http://codepen.io/patrickwc/pen/phHKk

代码（CSS）：

html, body { 
    margin: 0; 
    padding:0; 
    background: red; 
} 

img { 
    margin: 0; 
    padding: 0; 
    border: 0; 
} 

代码（HTML）：

<img src="http://upload.wikimedia.org/wikipedia/commons/b/b3/Various_grains.jpg"> 

这就是它！为什么图像没有齐平到页面底部？请有人把我从痛苦中解救出来。

Answer 1

图像是内联元素，所以像文本一样，它们在底部有一种排水沟，小写字母如y，g等会下垂。

设置图像显示：块，你失去了差距。