1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>未知高度的图片垂直居中</title> 6 <meta name="author" content="http://www.cnblogs.com/leafsummer?qq=11580563"> 7 <style> 8 div{ width: 500px;height: 500px;border: 1px solid #000;display: table;text-align: center;overflow:hidden; } 9 span{ display: table-cell;vertical-align: middle; } 10 </style> 11 <!--[if lte IE 7]> 12 <style> 13 div{ position:relative;overflow:hidden; } 14 span{ position:absolute;left:50%;top:50%; } 15 img{ position:relative;left:-50%;top:-50%; } 16 </style> 17 <![endif]--> 18 </head> 19 <body> 20 <div> 21 <span> 22 <img src="1.jpg" alt=""> 23 </span> 24 </div> 25 </body> 26 </html>
原文：http://www.cnblogs.com/leafsummer/p/4796237.html
