如前所述，图像被视为文本，因此底部是为了容纳那些讨厌的:“p,q,y,g,j”;最简单的解决方案是分配img display:block;在css中。

但这确实抑制了与文本一起流动的标准图像行为。保持这种行为，消除空间。我建议用这样的东西包装图像。

<style>
    .imageHolder
    {
        display: inline-block;
    }
    img.noSpace
    {
        display: block;
    }
</style>
<div class="imageHolder"><img src="myimg.png" class="noSpace"/></div>

如果你想保留图像为内联，你可以把vertical-align: top或vertical-align: bottom放在上面。默认情况下，它是在基线上对齐的，因此它下面的几个像素。

给出div .youtube-thumb图像的高度。这应该会在Firefox浏览器中设置问题。

.youtube-thumb{ height: 106px }

有了这个问题，在其他地方找到了完美的解决方案，如果你不想使用块只是添加

img { vertical-align: top }

如前所述，图像被视为文本，因此底部是为了容纳那些讨厌的:“p,q,y,g,j”;最简单的解决方案是分配img display:block;在css中。

但这确实抑制了与文本一起流动的标准图像行为。保持这种行为，消除空间。我建议用这样的东西包装图像。

<style>
    .imageHolder
    {
        display: inline-block;
    }
    img.noSpace
    {
        display: block;
    }
</style>
<div class="imageHolder"><img src="myimg.png" class="noSpace"/></div>

如果你不想修改块模式，你可以使用下面的代码:

img{vertical-align:text-bottom}

或者你可以用Stuart建议的following:

img{vertical-align:bottom}