使用百分比时,为什么CSS中的高度不起作用？

Question

所以,我试图将图像设置为html元素高度和宽度的100%(实际上浏览器窗口就是我想要的).我把CSS设置为

html{
  width:  100%;
  height: 100%;
}
img{
  width:   100%;
  height:  100%;
  z-index: 0%;
}

宽度表现正确,但高度不会改变.我尝试将它设置为高度:2%并保持相同的高度.我不想使用px来设置高度,因为我希望这可以在移动设备上运行,但是HEIGHT,YU NO NO？

Answer 1

你还需要height: 100%开启body.

按照您的确切示例,您可以:

html, body, img {
    width: 100%;
    height: 100%;
}

但是,看起来您可能正在尝试获取全屏背景图像(因为您使用z-index- 顺便说一下z-index,不使用%,只是一个简单的数字).

在这种情况下,您应该使用以下方法之一: