CSS 如何让这个高度响应？

Question

.wrapper {
  margin: 7%;
  height: 79vh;
  background-color: green;
  background-size: 300px;
}

<section class="wrapper">
  <h1>TEST</h1>
</section>

如您所见，它有些响应，但是当我将 window 关闭到 1200px 以下时，顶部的白色 space 会比底部多，我该如何解决这个问题？

我也使用了 vh，但它的定位方式有点脏。如果我没有身高，它只会显示第一个 <h1> 其他方式吗？

Answer 1

这是你想要的吗？

.wrapper {
    position:absolute;
    top:50%;
    left:50%;
    height:60%;
    width:60%;
    background-color: green;
    transform:translate(-50%,-50%);
}

<section class="wrapper">
            <h1>TEST</h1>
</section>

CSS 如何让这个高度响应？

CSS How can I make this height responsive?

html

css

height

css-position