当开发的网页出现y轴滚动条时,而你某个最外层元素的宽度用的是width: 100vw;或者width: 100%;时,这时候网页就会出现x轴的滚动条,但这个x轴滚动条是不需要的,且很难看。x轴滚动条出现的原因是y轴滚动条的宽度也占据了位置,导致视图缺少了这部分宽度,所以出现了x轴滚动条。
在style标签内添加以下样式即可将x轴滚动条隐藏:
html {
overflow-y: scroll;
}
:root {
overflow-y: auto;
overflow-x: hidden;
}
:root body {
position: absolute;
}
body {
width: 100vw;
overflow: hidden;
}