图片居中
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>图片在容器内，水平垂直居中</title> 6 <style> 7 .box{width:100px;height:100px;border:1px solid #000; text-align:center;} 8 span{display:inline-block;height:100%;vertical-align:middle;} 9 img{vertical-align:middle;} 10 </style> 11 </head> 12 <body> 13 <div class="box"> 14 <img src="http://www.zhinengshe.com/images/logo.png" alt="智能社"/><span></span> 15 </div> 16 </body> 17 </html>