如何使div垂直滚动

问题描述

我做了一个水平滚动列表的图片元素。但是当我做垂直滚动我没能做到。

I made a horizontal scroll with a list of picture elements.. But when I made to scroll it vertically I failed to do it.

我的水平代码scroller is

my code for the horizontal scroller is

<div class="pic-container" style="position:absolute; left: 3px; top: 102px;">
    <div class="pic-row">
        <div id="divd" style="width: 1680px;">
            <a href="writeA.html"><img src="images/A.Png" /></a>
            <a href="writeB.html"><img src="images/B.Png" /></a>
            <a href="writeC.html"><img src="images/C.Png" /></a>
            <a href="writeD.html"><img src="images/D.Png" /></a>
            <a href="writeE.html"><img src="images/E.Png" /></a>
            <a href="writeF.html"><img src="images/F.Png" /></a>
            <a href="writeG.html"><img src="images/G.Png" /></a>
            <a href="writeH.html"><img src="images/H.Png" /></a>
            <a href="writeI.html"><img src="images/I.Png" /></a>
            <a href="writeJ.html"><img src="images/J.Png" /></a>
            <a href="writeK.html"><img src="images/K.Png" /></a>
            <a href="writeL.html"><img src="images/L.Png" /></a>
            <a href="writeM.html"><img src="images/M.Png" /></a>
            <a href="writeN.html"><img src="images/N.Png" /></a>
            <a href="writeO.html"><img src="images/O.Png" /></a>
            <a href="writeP.html"><img src="images/P.Png" /></a>
            <a href="writeQ.html"><img src="images/Q.Png" /></a>
            <a href="writeR.html"><img src="images/R.Png" /></a>
            <a href="writeS.html"><img src="images/S.Png" /></a>
            <a href="writeT.html"><img src="images/T.Png" /></a>
            <a href="writeU.html"><img src="images/U.Png" /></a>
            <a href="writeV.html"><img src="images/V.Png" /></a>
            <a href="writeW.html"><img src="images/W.Png" /></a>
            <a href="writeX.html"><img src="images/X.Png" /></a>
            <a href="writeY.html"><img src="images/Y.Png" /></a>
            <a href="writeZ.html"><img src="images/Z.Png" /></a>
        </div>

我使用的css如下

.pic - container {
  /* The width of mydocument */
  width: 1350 px;
  margin: 0 auto;
  white - space: nowrap;
  overflow - x: inherit;
  overflow - y: hidden; -
  ms - overflow - style: -ms - autohiding - scrollbar;

}
.pic - row {
  /* As wide as it needs to be */
  width: 1527 px;
}

请指导我找到一个解决方案，使水平滚动div成垂直滚动

Please Guide me to found a solution to make that horizontal scrolling div into vertical scrolling

推荐答案

使用下面的css

pic-container {
    width: 50px;
    height: 200px;
    overflow-y: scroll;
    overflow-x:hidden;
}

查看小费链接

这篇关于如何使div垂直滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！