html - 如何垂直和水平居中div

<分区>

我遇到了一个问题，如何将文本 (h1) 在 div 中居中。我希望网页是全屏的，我用 vh 单位实现了这一点。

.page { height: 100vh; 
        width: 100%;}

在该页面上，我希望 div 水平和垂直居中。我试过

.div { top: 50%;
      left: 50%;}

但这并没有起到作用。我也希望它是“响应式”的，因为它位于任何屏幕的中心。我正在寻找构建这样的东西:http://www.anthonygoodisondesign.com/

最佳答案

使用如下CSS代码；

div{height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  }

<div>  <h1>center me</h1></div>

关于html - 如何垂直和水平居中div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41987915/