最近在用 Bootstrap 写一个需要适配 WEB 和 WAP 的网站，写完后发现 WAP 端总是会出现横向滚动条，也就是 X 轴滚动条，导致 WAP 端页面左右滑来滑去，很是令人蛋疼，即使设置了 overflow-x： hidden和 width:100% 也无法去除，通过各种途径寻找解决方法，最终在 张鑫旭 大神的一篇文章里找到了最终解决方法，在这里记录一下防止之后自己用得到时还需要重新找，也为那些同样有这方面问题的童鞋提供方便。
出现这种问题的主要原因就是，由于内容较多导致出现Y轴滚动条，占用了页面的宽度，从而导致在使用框架做自适应时出现X轴滚动条，影响用户体验。最终只需要在CSS中添加如下代码就可以完美解决，以后妈妈再也不用担心我的代码会出现横向滚动条了。
代码：
html {
overflow-y: scroll;
}
:root {
overflow-y: auto;
overflow-x: hidden;
}
:root body {
position: absolute;
}
body {
width: 100vw;
overflow: hidden;
}
内容参考自 张鑫旭大神的《小tip:CSS vw让overflow:auto页面滚动条出现时不跳动》
————————————————
版权声明：本文为CSDN博主「喵了__个咪」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/zx562602419/article/details/81293405