如何垂直和水平居中div

Question

我正面临一个问题,如何将div中的文本(h1)居中.我希望网页是全屏的,我用vh单位实现了这一点.

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

在那个页面上,我希望div水平和垂直居中.我试过了

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

但那只是没有做到的伎俩.我也希望这是"resposive"si,它以任何屏幕为中心.我希望建立这样的东西:http://www.anthonygoodisondesign.com/

Answer 1

使用css代码如下;

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

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