一、模拟表格法

<div id="wrapper">

   <div id="cell">

       <p>测试垂直居中效果测试垂直居中效果</p>

       <p>测试垂直居中效果测试垂直居中效果</p>

   </div>

</div>

#wrapper {display:table;width:300px;height:300px;background:#000;margin:0 auto;color:red;}

#cell{display:table-cell; vertical-align:middle;}

二、CSS3的box方法

<div class="center">

 <div class="text">

   <p>我是多行文字</p>

   <p>我是多行文字</p>

   <p>我是多行文字</p>

 </div>

</div>

.center {

 width: 300px;

 height: 200px;

 padding: 10px;

 border: 1px solid #ccc;

 background:#000;

 color:#fff;

 margin: 20px auto;

 display: -webkit-box;

 -webkit-box-orient: horizontal;

 -webkit-box-pack: center;

 -webkit-box-align: center;

 display: -moz-box;

 -moz-box-orient: horizontal;

 -moz-box-pack: center;

 -moz-box-align: center;

 display: -o-box;

 -o-box-orient: horizontal;

 -o-box-pack: center;

 -o-box-align: center;

 display: -ms-box;

 -ms-box-orient: horizontal;

 -ms-box-pack: center;

 -ms-box-align: center;

 display: box;

 box-orient: horizontal;

 box-pack: center;

 box-align: center;

}