Html css垂直对齐div，同时保留边距

我有一个html和css，它允许我将内容集中在容器中：

.container{
高度：100vh；
溢出：自动；
位置：相对位置；
}
.内容{
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
}

---

您可以为您的

.content

设置最大高度和溢出，因此可以在其中滚动：

.content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-height: 100vh;
    overflow: auto;
}

这就是不需要太多代码就可以做到这一点的方法

       .container{
            height: 100vh; 
            display:flex;
            justify-content:center;
            flex-direction:column;
            text-align:center
      }
    h1{ margin:0}