考虑以下示例：（现场演示在这里 http://jsfiddle.net/cXUnT/)
HTML:
<a><img src="http://img.brothersoft.com/icon/softimage/s/smiley.s_challenge-131939.jpeg" /></a>
CSS:
a {
display: block;
background: #000;
line-height: 40px;
}
img {
vertical-align: middle;
}
输出是：
为什么图像不垂直居中？
我该如何解决这个问题，以便它可以在所有主要浏览器中运行？
请不要假设任何图像大小（例如本例中的 32x32），因为在实际情况下图像大小是未知的。
您可以使用position:absolute;为了这。
例如：
a {
display: block;
background: #000;
line-height: 40px;
height:80px;
position:relative;
}
img {
position:absolute;
top:50%;
margin-top:-16px;
}
NOTE：这给出了margin-top图像大小的一半。
检查这个http://jsfiddle.net/cXUnT/7/ http://jsfiddle.net/cXUnT/7/
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
