<分区>
请看下面的jsFiddle:http://jsfiddle.net/Leng/kQvNH/
谁能解释为什么每行水平点周围似乎有大量填充(大约 15px 上方和 4px 下方)？图片只有 2px 高。填充来自哪里？
请注意:
对我来说，当我以 HTML5 标题开始我的文档时，这种围绕图像的神秘填充只会发生:
<!DOCTYPE html>
<html>
当我使用-任何其他- 标题时，图像正常显示(无填充)，例如 HTML4 或此网页的 XHTML 标题:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
所以这似乎是 HTML5 的不一致。我想切换到标准的 HTML5 标题，但这个小烦恼阻止我这样做。
感谢您的指导。
解决方案:
这是带有解决方案的 jsFiddle:http://jsfiddle.net/Leng/Sn2PC/
img
{
display:block;
margin:0 auto;
}
这是基于 Chris 在下面的回答。
请注意，设置 font-size:0 或 line-height:0 不是解决方案，因为这(显然)会混淆字体大小和行高。
而且，在 HTML4 或 XHTML 中，将显示设置为阻塞和建立自动边距并不是实现正常、居中、未填充图像所必需的。
HTML5 创造了这个“功能”，其中图像是内联的，并且将根据行高或字体大小进行填充。