css - div内图像的CSS垂直对齐

Question

我有这个 div 并且 div 里面是一个图像，我想要做的是将图像垂直对齐到中间居中，我尝试的任何方法似乎都不起作用......

<div style=" height: 200px; vertical-align: middle; width: 225px;">
<img width="225" src="upload/home5.jpg">
</div>

我也尝试过vertical-align:middle;在图像中添加一个，但这没有用。

有人有什么想法吗？

我忘了提到我正在使用一些 jQuery 代码，它使我的 divposition:absolute;

这是我的 div 在通过 Jquery 后的样子

<div style="position: absolute; top: 0px; left: 0px; display: block; z-index: 4; opacity: 1; width: 225px; height: 200px;">

这是图像的css

img {    
    background-color: #eee;
    margin: auto;
    display:block;
}

score 1 · Accepted Answer

您可以在 div 上使用 display: table-cell 。这允许垂直对齐属性起作用。不支持IE7。如果您需要，还有其他解决方案。

div { border: 1px solid gray; display: table-cell;  }
img { vertical-align:middle; }

1 回答 1