0

我有一个 div 里面的图像。会有很多图像，所以我希望能够在 div 中向下滚动。我怎么做？

谢谢 ：）

HTML：

<div id="TextureView">
    <div id="TextureViewInside">
        <ul class="products">
             <img src="FärgadePapper.png">
             <img src="Hajar.png">
             <img src="Labyrint.png">
             <img src="Martini.png">
             <img src="FärgadePapper.png">
             <img src="Hajar.png">
             <img src="Labyrint.png">
             <img src="Martini.png">
        </ul>
    </div>
</div>

CSS：

#TextureView{
    overflow: hidden;
}
#TextureViewInside{
    padding: 7px;
}
ul.products img{
    width: 80px;
    display: inline-block;
    vertical-align: top;
    padding: 4px;
}

我的 JavaScript 是空的，所以没有显示的意义。

4

5 回答 5

4

使用以下代码：

#TextureView { 
  height: 450px;
  overflow: auto;
}

一旦图像超过容器的高度，您将有一个滚动条，否则 - 滚动条不会出现。

于 2013-11-09T16:17:37.447 回答
2 
overflow:scroll;

应该为此目的工作

overflow-y:scroll;

如果您想从左到右滚动内容（反之亦然），将水平创建滚动条

overflow-x:scroll;

将垂直创建滚动条

于 2013-11-09T16:15:16.307 回答
1

您需要将溢出设置为滚动：

#TextureView { overflow: scroll; height: 400px; }

一旦内部超过指定的高度，这将导致出现滚动条（不一定是400px）。或者，您可以说只是overflow-y为了获得一个唯一的垂直滚动条。

于 2013-11-09T16:15:06.890 回答
1 
#TextureView{ 
overflow-y:scroll;
height:500px;
}

修改你的css并根据你的需要保持div的高度

于 2013-11-09T16:16:12.043 回答
0

将您的 CSS 更改为以下内容：

#TextureView{
    overflow: scroll;
    height: 200px;
}

会工作。 overflow: scroll;允许出现滚动条。设置height可以防止 DIV 自动扩展。

我在这里创建了一个演示，以展示上面的内容、下面的内容和可滚动的 DIV 的外观。

于 2013-11-09T16:21:05.977 回答