③ display:inline-block和文字大小控制居中
这是我自己想到的方法，代码相当简洁，是个成本很低，效果惊人的方法，适用于多图显示的情况。只需要一层必须要的a标签就解决问题了！
HTML部分（仅示例两张图片，其他重复，故略）：
复制代码
<div class=”zxx_align_box_5 fix”>
<a href=”#zhangxinxu”>
<img src=”http://image.zhangxinxu.com/image/study/s/s128/mm1.jpg” />
</a>
<a href=”#zhangxinxu”>
<img src=”http://image.zhangxinxu.com/image/study/s/s128/mm2.jpg” />
</a>
</div>
css部分：
复制代码
.zxx_align_box_5 a{display:inline-block; width:1.2em; font-size:128px; text-align:center; vertical-align:middle;}
.zxx_align_box_5 a img{vertical-align:middle; padding:2px; border:1px solid #beceeb;}
需要说明的：
1.img外的标签需是a标签或span这类inline属性的标签，div标签也可以，但是css代码多些:display:inline; display:inline-block先变成inline属性，再转变成inline-block属性，原因讲起来又是一篇长长的文章，放着。
2.此方法只需要两层标签即可，可谓代码超简洁，但是只适用于多图垂直居中对齐的情况。因为其对齐原理是相邻的图片居中对齐，如果只是一个图片，vertical-align:middle就只有与空格对齐了。
④ 使用空白图片实现垂直对齐
好吧，我知道说大话会被人笑的，但是我还是非常自信地推荐下面这种我想出来的图片垂直居中对齐的方法。非常简单，非常易懂，出错率低，上手方便，兼容性上佳！
HTML部分（仅示例一张图片，其他重复，故略）：
复制代码
<ul class=”zxx_align_box_6 fix”>
<li>
<img class=”show_img” src=”http://image.zhangxinxu.com/image/study/s/s128/mm1.jpg” />
<img class=”alpha_img” src=”../image/pixel.gif” />
</li>
</ul>
css部分：
