Question

我已经制作了固定高度的div，我希望文本对齐   在div中垂直和水平。

我尝试使用margin：auto和   text-align但它没有帮助。

我是HTML / CSS初学者。

 <!DOCTYPE html>
    <html>
    <body>

    <div style="background-color:black;color:white;padding:20px; height:400px;">
      <h2>London</h2>

    </div>

    </body>
    </html>

Answer 1

h2 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

Answer 2

使用此

.align{
  text-align: center;           
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

Answer 3

h2 {
    position: absolute;
    top: 50%;
    left: 50%;
}

    <div>
      <h2>London</h2>

    </div>

居中在div元素中水平和垂直对齐文本

3 个答案: