介绍 scrollbar-width:,没有,,/*,Firefox */ -ms-overflow-style:,没有,,/*,IE 10 +, */ :: -webkit-scrollbar {
,,显示:没有,,/*,Chrome Safari */} .demo:: -webkit-scrollbar {
,,显示:没有,,/*,Chrome Safari */}
.demo {
scrollbar-width才能:没有,,/*,firefox */-ms-overflow-style才能:没有,,/*,IE 10 + */overflow-x才能:隐藏;
,,overflow-y:汽车;
}
这篇文章给大家分享的是有关怎么使用CSS隐藏元素滚动条的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
如何隐藏滚动条,同时仍然可以在任何元素上滚动?
首先,如果需要隐藏滚动条并在内容溢出时显示滚动条,只需要设置溢出:汽车样式即可。想要完全隐藏滚动条只需设置溢出:隐藏即可,但是这样一来将导致元素内容不可滚动。时至今日,还没有任何一条CSS规则可以使元素可以隐藏滚动条的同时依然可以滚动内容,只能通过针对特定浏览器设置滚动条样式来实现。
<强> Firefox浏览器
对于Firefox,我们可以将滚动条宽度设置为没有:
<强> IE浏览器
对于IE,我们需要使用-ms-prefix属性定义滚动条样式:
<强> Chrome和Safari浏览器
对于Chrome和Safari浏览器,我们必须使用CSS滚动条选择器,然后使用显示:没有隐藏它:
注意:当你要隐藏滚动条的时候,最好将溢出显示设置为汽车或者滚动保证内容是可滚动的。
<强>示例
我们使用上面的CSS属性以及溢出实现下面一个实例,不明,和终止,隐藏水平滚动条,同时允许垂直滚动条:
,
感谢各位的阅读!关于“怎么使用CSS隐藏元素滚动条”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!
