全局滚动条显隐抖动问题

全局滚动条的显示与隐藏会影响页内元素,在全局添加以下css可以使滚动条不占位置

:root {
  overflow-x: hidden;
}
:root body {
  width: 100vw;
}

原理:使body的宽度等于100vw，100vw包含滚动条的宽度，overflow-x: hidden;可以使页面没有横向滚动条。
一般的项目无需横向滚动条，一般使用响应式解决多屏问题。

参考内容：小tip:CSS vw让overflow:auto页面滚动条出现时不跳动

不过我使用的时候在vue项目中，使用这位博主的方法。无法竖向滚动，可以在原生html中生效。