摆脱内嵌块图像下方的空间

我怎样才能摆脱图像的底部和包装之间的空间，同时保持图像内联块？ 为什么发生这种情况？

http://jsfiddle.net/dJVxb/2/

HTML：

<div id="wrapper"> <img src="https://twimg0-a.akamaihd.net/profile_images/1735360254/icon_reasonably_small.jpg" > </div> 

CSS：

 ​#wrapper { background:green; } img { display:inline-block; margin:0; } 

Answer 1

写vertical-align:top; 。 这样写：

 img { display:inline-block; margin:0; vertical-align:top; } 

检查这个http://jsfiddle.net/dJVxb/4/

Answer 2

那里增加的空间是为了让下行的空间也有内联文字。 下降部分是字母的一部分，如'y'和'g'。

如果您需要保留center或baseline的vertical-align属性，可以通过将line-height设置为0来解决此问题。