如何将我的h2标签放置在空白div底部？

Question

似乎无法做到这一点，我有一个div 200px x 200px和一个h2标签，我想在盒子死点的底部位置，我尝试了垂直对齐中心，但这似乎并没有解决问题？我也尝试添加相对于盒子的位置，然后确定h2的绝对位置，但是我确定这是更好的方法吗？

<div class="box"> 
<h2>My title</h2> 
</div> 

.box{ 
     width: 200px; 
     height: 200px; 
     background: #dedede; 
} 

h2{ 
    text-align: center; 
    vertical-align: bottom; 
} 

Answer 1

那里提供了多个解决方案。

第一：更新你的CSS来：

.box{ 
    width: 200px; 
    height: 200px; 
    background: #dedede; 
    position:relative; 
} 

h2{ 
    text-align: center; 
    width:100%; 
    position:absolute; 
    bottom:0; 
} 

Answer 2

的另一种方式是：

h2{ 
    text-align: center; 
    width:100%; 
    line-height:370px; 
}