Question

之前，我曾询问如何在div中居中对齐图像（带动态宽度），并且有人回复了此代码：

它正常工作。但是，当我尝试将同一个类用于另一个图像时，另一个图像不再垂直居中：

你看，现在，50x50的黑色图像略高于应有的值。我注意到只有第一张图像才能正确对齐。如果我之后添加不同宽度和高度的其他图像（使用相同的类），它们将会未对齐。

有人可以帮我找到问题，因为我对javascript并不熟悉。

Answer 1

您需要将JavaScript包装为所有匹配元素的所有内容，而不是计算一个的高度并应用于所有元素：

$('div.container_img img').each(function() {
    var $img = $(this);
    var h = $img.height();
    $img.css('margin-top', +h / -2 + "px");
});

Answer 2