1、主要利用在父元素上设置display:-webkit-box;

    和在子元素上设置相同的line-height;

  html代码: 

  <div id="box">
    <div class="icon_download"></div>       //图标
    <div class="wrap">蜗居中了</div>
  </div>

  css样式 

  #box{
    display:box;
    display:-webkit-box;
  }  

  #box div{
    line-height:80px;
  }
  #box .icon_download{
    font-size:12px;
  }
  #box .wrap{
    font-size: 24px;
  }

2:用一个div 将需要垂直居中的元素包裹起来,将子元素全部设置:display:inline-block和vartical-align:middle;

  注意:全部的子元素都要用标签包裹,文字也要用标签包裹

  HTML代码

  <div id="box1">
    <div class="icon_time"></div>
    <div class="wrap">蜗居中了</div>
  </div>

 css样式

  #box1 *{
    display:inline-block;
    vertical-align: middle;
  }