在 div 溢出上禁用垂直滚动条: auto

当使用溢出时，是否可能只允许一个水平滚动条: auto (或者滚动) ？

441436 次浏览
小开
最佳答案

这两个 CSS 属性可以用来隐藏滚动条:

overflow-y: hidden; // hide vertical
overflow-x: hidden; // hide horizontal
小开

溢出: 自动;
溢出: 隐藏;

对于 IE8: - ms-overflow-y: 隐藏;

否则:

为了隐藏 X:

<div style="height:150x; width:450px; overflow-x:hidden; overflow-y: scroll; padding-bottom:10px;"></div>

为了隐藏 Y:

<div style="height:150px; width:450px; overflow-x:scroll ; overflow-y: hidden; padding-bottom:10px;"></div>
小开

你应该只用

overflow-y:hidden; -使用这个来隐藏垂直滚动

overflow-x:auto; -使用此选项显示水平滚动

卢克说两者都藏起来了，所以我把这个分开给你们。

小开

如果你想同时在 Gecko (NS6 + ，Mozilla 等)和 IE4 + 中实现同样的功能，我相信这个技巧可以做到

body {
overflow: -moz-scrollbars-vertical;
overflow-x: hidden;
overflow-y: auto;
}

这将适用于整个主体标签，请更新到您的相关 css 和应用此属性。

小开

加入以下内容:

body{
overflow-y:hidden;
}
小开

这些规则在所有浏览器中都是兼容的:

body {overflow: hidden; }
body::-webkit-scrollbar { width: 0 !important; }
body { overflow: -moz-scrollbars-none; }
body { -ms-overflow-style: none; }
小开

如果您想禁用滚动条，但仍然能够滚动内部 DIV 的内容, 在 css 中使用以下代码,

.divHideScroll::-webkit-scrollbar {
width: 0 !important
}
.divHideScroll {
overflow: -moz-scrollbars-none;
}
.divHideScroll {
-ms-overflow-style: none;
}

DivHideScroll 是目标 div 的类名。

它适用于所有主流浏览器(Chrome、 Safari、 Mozilla、 Opera 和 IE)

小开

用速记法怎么样？

{overflow: auto hidden;}
小开

我用了这个密码

html, body
{
-ms-content-zooming:none;
touch-action: none;
content-zooming: none;
overflow-y: hidden; // hide vertical
overflow-x: hidden;
overflow-y: none; // hide vertical
overflow-x: none;
}

提交答案