Question

我的图像里面有一个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是空的，所以没有任何意义......

Answer 1

使用以下代码：

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

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

Answer 2

overflow:scroll;

应该为此目的而工作

overflow-y:scroll;

如果要从左到右（或反之）滚动内容，

将水平创建滚动条

overflow-x:scroll;

将垂直创建滚动条

Answer 3

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

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

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

Answer 4

#TextureView{ 
overflow-y:scroll;
height:500px;
}

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

Answer 5

将CSS更改为以下内容：

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

会奏效。 overflow: scroll;允许滚动条显示。设置height可使DIV自动扩展。

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

如何在div中滚动？

5 个答案: