首先想到的肯定是使用overflow:hidden
,但是,当你使用时,你会发现,在将滚动条去掉的时候,页面会发生抖动。
那么,如何防止页面的抖动呢?
::-webkit-scrollbar {
width: 0px;
}
使用这个方式,能够将滚动条隐藏,页面仍然可以滚动,但是只支持webkit浏览器,兼容性并不好。
解决办法参考自张鑫旭博客(http://www.zhangxinxu.com/wordpress/2015/01/css-page-scrollbar-toggle-center-no-jumping/)
html {
overflow-y: scroll;
}
:root {
overflow-y: auto;
overflow-x: hidden;
}
:root body {
position: absolute;
}
body {
width: 100vw;
overflow: hidden;
}
如果觉得我的文章对您有用,请您随意打赏。您的支持将鼓励我更加努力创作!
如无特殊声明,文章均为原创,若有不正之处,万望告知。转载请附上原文地址,十分感谢!