怎么水平垂直对齐多行文本？

Question

给P标签加上line-height 一行文本可以对齐，但是多行的话就不行了，这个怎么解决？不要添加额外的标签，由于兼容IE8，只能用css了

<div class="dv">
  <p>123</p>
  <p>123</p>
  <p>123</p>
</div>

 <style>
    .dv{
        width: 500px;
        height: 200px;
        background-color: pink;
        margin: 0 auto;
    }
    p{
        line-height: 200px; 
    }
</style>

Answer 1

这种东西，网上一查一堆。我觉得等，还不如自己搜索。毕竟是常用的。

张鑫旭-多行文字的水平垂直居中-传送门

Answer 2

转化为块状行内元素（display:inline-block），然后使用vertical-align:middle;

Answer 3

楼上正解，本来想写的···还是自己琢磨吧，原理都说出来了

Answer 4

.dv {
  width: 500px;
  height: 200px;
  background-color: pink;
  margin: 0 auto;

  display: table-cell;
  vertical-align: middle;
}
p {
  //line-height: 200px;
  
  vertical-align: middle;
}