css给body设置overflow: auto无效

2022-01-18

css的特色之处在于会出现各种各样非标准的奇葩现象。

一个页面需要高度满屏,背景铺满固定,然后内容可以上下滚动。css这样写:

body{
  width: 100%;
  height:100vh;
  min-height:100vh;
  background: url(../images/bg.jpg) no-repeat 0 0;
  background-size: cover;
  overflow: auto;
}

结果发现body的高度超出了100vh,overflow: auto 无效。谷歌了下,找到了解决方案,给html加一个属性:overflow: auto;

html{
  overflow: auto;
}

问题解决。