首页 > 代码库 > 图片上没有line-height垂直居中

图片上没有line-height垂直居中

<style>div {     width: 150px;     height: 155px;     line-height: 155px;     border: 1px solid #000;     background: #f00;     text-align: center; } img {     vertical-align: middle; } span {     display: inline-block; } </style><div>     <img src="http://www.mamicode.com/hl_logo.png"  width="95" height="115">     <span></span> </div> 

 注意我们添加了一个额外的span从而在7以下版本的IE中修复该bug;我们还将display属性设置为inline-block来使我们关键的span拥有“layout”。最后结果:一切都正常了。