这是我的html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<div style="border:1px solid red; float:left; padding:0;">
<img src="xxx.jpg">
</div>
我不知道为什么div包含一些padding-bottom,即使我设置padding：0.
解决方法
img { display:block; }
要么
img { vertical-align:bottom; }
会工作.由于图像是内联的,文本是内联的,所以用户代理为下降字符(y,q,g)留下一些空间.要取消对图像的这种效果,您可以指定上述任何一种样式,尽管您可能希望使规则更具体,因此您不要定位不希望将其应用于的图像.
另一个海报已经指出的另一个选择是在父元素上将line-height设置为0.
技术说明：https://developer.mozilla.org/en/Images,_and_Mysterious_Gaps
