css – Body设置为overflow-y:隐藏,但页面仍然可以在Chrome中滚动

前端之家收集整理的这篇文章主要介绍了css – Body设置为overflow-y:隐藏,但页面仍然可以在Chrome中滚动前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
Chrome中的overflow-y属性出现问题。
即使我设置为隐藏,我仍然可以滚动页面与鼠标滚轮。

这是我的代码

<body>
  <div id="content">
    <div class="step">this is the 1st step</div>
    <div class="step">this is the 2nd step</div>
    <div class="step">this is the 3rd step</div>
  </div>
</body>

html,body {
  overflow-y:hidden;
}

#content {
  position:absolute;
  width:100%;
}

.step {
  position:relative;
  height:500px;
  margin-bottom:500px;
}

有人知道如何阻止Chrome中的垂直滚动吗?

谢谢!

解决方法

设置你的身体的高度和100%的HTML应该解决你。没有定义的高度,你的内容不会溢出,所以你不会得到所需的行为。
html,body {
  overflow-y:hidden;
  height:100%;
}

猜你在找的CSS相关文章