Html 滚动包含图像而非文档的DIV_Html_Css

Html 滚动包含图像而非文档的DIV

html css

Html 滚动包含图像而非文档的DIV,html,css,Html,Css,我有一个大的图像在一个div中，我想滚动。但是我没有使用div滚动，而是使用文档滚动如何使图像在DIV中滚动而不是在父级或文档中滚动？我的代码： <!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" &

我有一个大的图像在一个div中，我想滚动。但是我没有使用div滚动，而是使用文档滚动

如何使图像在DIV中滚动而不是在父级或文档中滚动？

我的代码：

<!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" >
<head>
    <title>Force Scroll</title>
    <style type="text/css">
        .scrollable 
        {
            overflow: auto;
        }
    </style>
</head>
<body>

<div class="scrollable">
    <img src="image.jpg" alt="test image" />
</div>

</body>
</html>


强制卷轴
.可滚动
{
溢出：自动；
}

为div设置一个（最大）宽度和高度，它应该可以工作。否则，div将根据图像大小自行调整：

#mydiv {
  overflow: auto;

  max-width: 800px;  // or width instead of max-width
  max-height: 600px; // or height instead of max-height
}

这里的示例：

如果你被迫支持像IE6这样的古老浏览器，你需要使用

width

和

height

而不是

max width

和

max height

，否则它仍然无法工作。

你需要固定div的大小，例如：

width: 200px;
height: 200px;

您需要定义宽度和高度。div是块元素，将根据需要占用尽可能多的空间。在这种情况下，与图像一样大