css 有没有办法把垂直滚动条变成水平滚动条?[已关闭]

qpgpyjmq  于 2023-03-20  发布在  其他
关注(0)|答案(1)|浏览(159)

已关闭。此问题需要超过focused。当前不接受答案。
**想要改进此问题吗?**更新此问题,使其仅关注editing this post的一个问题。

昨天关门了。
Improve this question
所以我有一个div,它会垂直溢出,因为它显示文本,并且有一个最大高度。
当上面的情况发生时,我想要一个水平滚动条来代替垂直滚动条,当滚动时会有垂直滚动div的效果?

ffx8fchx

ffx8fchx1#

要进行横向滚动,需要一个有宽度和高度的父元素,并设置为相对位置。然后添加一个宽度更大的文本元素,并使其绝对位置。现在添加overflow-x: scroll;来看看魔术。并设置overflow-y: hidden;,使其不能垂直滚动。
超文本:

<div id="scrollable-div">
   <a>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</a>
</div>

CSS:

#scrollable-div {
   height: 100px;
   width: 300px;
   overflow-x: scroll;
   overflow-y: hidden;
   position: relative;
}
      
a {
   width: 600px;
   height: 100px;
   position: absolute;
}

相关问题