在100％高度部分响应地对齐内容（flexbox？）

Question

我是编码的新手，我正在使用bootstrap制作响应式单页滚动条。每个部分的高度为100％，因此它会根据窗口的大小而变化。 我想知道如何证明我的内容是正确的，因此它在窗口中垂直居中，并且在该部分中的不同对象之间具有相等的空间。我试过用flexbox做这个，但它没有用完。我愿意使用css，flexbox或js。

提前谢谢！

这是我的代码对每个部分的简化版本：

name {
  height:100%;
}

<section class="name">
  <div class="container">
    <div class="row">
      <h1 class="col-xs-12">Header</h1>
      <p class="col-xs-12">Info</p>
      
      <img class="col-xs-12" src="-">
    </div>
  </div>
</section>

Answer 1

试试这可能会有所帮助：（css）

name {
height: 100%;
width: 100%;
display: block;
}