javascript - 如何在不改变宽度/高度的情况下垂直和水平对齐 DIV 中的图像？

Question

有什么办法吗？使用 JavaScript/JQuery？我真的真的真的非常需要它。如有任何帮助，我们将不胜感激。

Answer 1

当不需要时不要使用 JavaScript...

后台方法

您可以将其设置为背景...

div {
   background: url(/path/to/img.png) no-repeat center center;
}

jsFiddle .

<小时/>

position:absolute方法

或者你可以绝对定位img...

div {
   position: relative;
}

div img {
   position: absolute;
   top: 50%;
   left: 50%;
   margin-left: -50px;
   margin-top: -50px;
}

jsFiddle .

其中 -50px 是图像尺寸的一半。

<小时/>

display:table-cell 和 vertical-align: middle 方法

您还可以使用vertical-align: middle。

div {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
}

jsFiddle .

请记住，这在 < IE8 中不起作用。

^{还有更多方法可以实现这一目标...}