使用css垂直居中图像内部容器元素

Question

我需要使用CSS将一些图像垂直居中在容器<li>块内，但我不知道如何去做。我可以使用javascript来计算图像的高度，然后做一些数学运算，使用边距将其垂直居中，但这看起来很笨拙而且很愚蠢。

是否有任何基于CSS的解决方案可以在不使用固定边距的情况下完成垂直对齐（图像高度是可变的）？

图像贴在容器li元素的顶部：

Answer 1

您可以使用此css属性：

display: table-cell; vertical-align: middle;

喜欢这个演示：jsfiddle.net/ongisnade/P94YE/

Answer 2

这可能会解决您的问题：

vertical-align: middle;

Answer 3

这就是我一直在使用的..
            vertical-align: middle;

Answer 4

Fredy的答案对于现代浏览器是正确的，但不适用于IE 8之前的其他技术：http://phrogz.net/css/vertical-align/index.html

Answer 5

希望这有帮助！ http://css-tricks.com/snippets/css/center-div-with-dynamic-height/