css文字垂直居中

1、确定高度单行垂直居中

  line-height（兼容低级浏览器）：
  <style>
      .center{height:25px; line-height:25px; overflow:hidden;}  
  </style>
  <div class="center">我是垂直居中</div>

  display:table-cell; vertical-align:middle;（变成表格）：
  <style>
        .center{display:table-cell; height:40px;display:table-cell; vertical-align: middle; overflow:hidden;background:#FAD8E3;}
  </style>
  <div class="center">我是垂直居中</div>

2、确定高度多行文本垂直居中

  display: table;（兼容ie8以上浏览器，包含ie8）
  <style>
      .wrap{dispaly:table; height:400px; width:100px; }
      .content{display:table-cell; vertical-align:middle; border:1px solid #f00; backgroung:#e3e3e3;}
  </style>
  <div class="wrap">
      <div class="content">我是垂直居中，多行文本垂直居中；</div>
  </div>

translate（兼容ie9以上浏览器，包含ie9；此方法也适用于单行文本居中）

  <style>
        .wrap{width: 100px; height: 100px; position: relative; background: #FAD8E3; }
        .center{position: absolute; top: 50%; transform: translate(0,-50%);}
  </style>
  <div class="wrap">
      <div class="center">我是垂直居中，多行文本垂直居中；</div>
  </div>