Question

我需要删除网站中的滚动条。

但是当我使用overflow: hidden时，我的页面将不再滚动。还有其他解决方案吗？

我找不到谷歌。

Answer 1

我试过使用overflow：hidden;但它确切地说你所说的..所以你应该尝试将它添加到你的CSS。

body::-webkit-scrollbar{
    display: none;
}

Answer 2

基本上可以隐藏页面上的元素是指定display: none; or visability: hidden;

即使是不可见的元素占用了页面上的空间。使用“display”属性创建不占用空间的不可见元素！

Answer 3

我认为在保留滚动功能的同时隐藏滚动条并不存在跨浏览器解决方案。

虽然，您可以轻松地模拟这种行为，在全身包装的帮助下，它采用了身体的尺寸，但在右边填充以隐藏滚动条。

是的，您必须将overflow:hidden属性赋予body，但您的包装器将成为新的可滚动元素。以下内容适用于您：

<强> HTML

<div id="wrapper">Lots of text.....</div>

<强> CSS

html{
    height:100%;
}
body{
    margin:0;
    overflow:hidden;
    height:100%;
}
#wrapper{
    width:100%;
    height:100%;
    overflow:auto;
    padding-right:20px;
}

JSFiddle

Answer 4

尝试：

Overflow : auto

如果需要滚动，它将自动显示。

您也可以尝试

Overflow-X : auto
Overflow-Y : auto

如果这可以解决您的问题，请告诉我。

Answer 5

如果您需要删除滚动条，则可以使用这些属性。请检查并分享是否适合您。检查 DEMO 。

#container{
    width:100%;
    height:100%;
    overflow:auto;
    position:fixed;
    padding-right:20px; /*will give a Illusion of removing the scrollbar because browser scrollbar width is 20px*/
}

在保持滚动功能的同时删除滚动条

5 个答案: