css 为什么滚动条会出现在我的图像元素上？

dba5bblo 于 2023-11-19 发布在其他

关注(0)|答案(4)|浏览(142)

<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的尺寸时才会出现）

4条答案

这是因为img是一个内联标签，所以它为文本的上升和下降留出了空间。将img设置为display: block，它就会正常工作。

这是因为在<div>中插入了一个空的文本节点，并且添加了足够的空间来需要滚动条。

div {
    width: 260px;
    height: 195px;
    overflow: auto;
    background: #333;
    font-size: 0;
    line-height: 0;
}

字符串
In action here的一个。

将display: block添加到img。
See it的一个。

默认情况下，div有填充值，您应该将其设置为0。

padding: 0px;

字符串