1 <html> 2 <head> 3 <meta charset="utf-8"> 4 <style type="text/css"> 5 <!-- 6 * {margin:0;padding:0} 7 .one{ 8 width:500px; 9 height:500px; 10 border:1px solid red; 11 text-align:center; 12 } 13 .one img{ 14 width:100px; 15 vertical-align: middle; 16 } 17 18 p:after{ 19 display:inline-block; 20 height:100%; 21 vertical-align:middle; 22 content:""; 23 } 24 </style> 25 </head> 26 <body> 27 28 <div class="one"> 29 <a href="#" style="height:100%;vertical-align:middle;display:block;">文字居中<i style="display:inline-block;height:100%; vertical-align:middle"></i></a> 30 </div> 31 32 33 <div class="one"> 34 <img src="one.jpg" />图片居中<i style="display:inline-block;height:100%; vertical-align:middle"></i> 35 </div> 36 37 38 <div class="one"> 39 <p><img src="one.jpg" alt="" />图片居中</p> 40 </div> 41 </body> 42 </html>
原文：http://www.cnblogs.com/hwgq2005/p/3931642.html