Question

我想要水平溢出，当屏幕宽度不那么宽时，DIV开始向左右滚动，但我希望它看起来不那么难看我现在拥有它（div底部的滚动条）。

.wrapper {
    position: relative;
    overflow-x: scroll;
    overflow-y: hidden;
}

.content {
    margin: 0 auto;
    width: 1198px;
}

HTML

<div class=wrapper>
  <div class=content">
    My content here.. 
  </div>
</div>

另一个问题 - CSS的设置是什么允许＆＃34;刷卡＆＃34;对于div而不是＆＃34;拖动和移动＆＃34; ..？

Answer 1

对于支持浏览器的纯CSS解决方案，您可以使用::-webkit-scrollbar和一些填充的组合，如下所示：

.wrapper {
    width: 100%;
    height: 400px;
    position: relative;
    overflow: hidden;
}

.content {
    width: 100%;
    height: 100%;
    overflow: auto;
    padding-right: 17px; /* This hides the right scrollbar */
    padding-bottom: 17px; /* This hides the bottom scrollbar */
}

.content::-webkit-scrollbar { 
    display: none; 
}

<div class="wrapper">
  <div class="content">
    <img src="https://i.ytimg.com/vi/ETDz5z46Loo/maxresdefault.jpg" />
  </div>
</div>

最好在JSFiddle中使用：https://jsfiddle.net/thepio/pavb2hfy/

滚动时CSS隐藏滚动条

1 个答案: