html - 为什么会出现滚动条？

Question

我有the following simple code :

HTML:

<div>
    <img src='http://i51.tinypic.com/4kz4g5.jpg' />
</div>

CSS:

div {
    width: 260px;
    height: 195px;
    overflow: auto;
    background: #333;
}

图片的尺寸为width=260px, height=195px，与div的尺寸完全一样。

我的问题是为什么在这种情况下会出现滚动条？ (我希望它们仅在图像尺寸大于 div 的尺寸时出现)

Answer 1

因为img是内联标签，所以它给文本的ascenders和descenders留出了空间。将 img 设置为 display: block，它将正常工作。