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

时间:2010-04-26 20:05:21

标签: html css image vertical-alignment

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

e.g。

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

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

最好的方法是什么?我知道列表中的图像不是有效的HTML(AFAIK)。

谢谢:)

2 个答案:

答案 0 :(得分:2)

您可以使用

li img {vertical-align: middle;}

如果文字适合一行

答案 1 :(得分:1)

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

li { line-height: 42px }

是的,在imgli完全有效,因为img(默认情况下)是内联元素,而li是块级元素。