如何根据屏幕高度调整div

Question

我正在开发一个软件，我对该软件的page wrapper div有一个小问题。现在我想要的是根据打开它的屏幕高度来调整div的高度。

我尝试使用percentage(%)设置高度，但在打开到不同屏幕尺寸的其他计算机时仍然无效。

我很抱歉，如果我不能为你提供一些照片，因为我没有足够的声望来附上一些照片。

非常感谢任何建议。谢谢

Answer 1

您可以使用vh。

100vh是屏幕的高度，您可以使用vh更改元素相对于屏幕高度的高度。

  

vh的一个单位是视口高度的1％。 “视口”==浏览器窗口大小==窗口对象。如果视口高度为40cm，则为1vh == 0.4cm。

<强>演示

div {
  height: 50vh;
  width: 50vw;
  background: yellow;
}

<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam unde soluta ex beatae reprehenderit ab repellat nostrum maxime in enim. Enim, reiciendis ducimus eligendi quam iure eius voluptatibus provident facilis?</div>

Docs

阅读更多：https://css-tricks.com/viewport-sized-typography/