列表中的垂直对齐文本和图像

Question

有没有办法在列表中垂直对齐文字和图像？

e.g。

<li>Some text here <img src="image.jpg" alt="" /></li>

文本没有在图像侧面的中间对齐，它出现在底部，然后图像在它旁边。我需要将文本放在侧面图像之间的中心点。

最好的方法是什么？我知道列表中的图像不是有效的HTML（AFAIK）。

谢谢：）

Answer 1

您可以使用

li img {vertical-align: middle;}

如果文字适合一行

Answer 2

如果文本没有换行，您可以将行高设置为与图像高度相同：

li { line-height: 42px }

是的，在img内li完全有效，因为img（默认情况下）是内联元素，而li是块级元素。