图片大小不一样时如何同时设置垂直居中
第一步:给img找一个参照物,即在img后面插入一个空标签,例如<span> </span>
第二步:给img设置{vertical-align:middle;}
第三步:给空标签span设置{display:inline-block; height:100%; vertical-align:middle;}
<ul>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
<li><a href="#"><img src="img/weibo.jpg"><span></span></a></li>
</ul>