如何垂直对齐到X高度？

Question

我有一行文字和一个小图像，我试图在行内垂直对齐。我的目标是将图像的垂直中心与文本基线的x高度（或大写字母高度的一半）对齐。我无法想出任何方式来做到这一点。我所知道的最接近的事是：

vertical-align: middle; 

这种行为，因为它在CSS 2.1规范指出：

对齐框的垂直中点与父框加一半的基线父母的x高度

如果有一种方法可以从该定义中删除世界“一半”，我就会得到我想要的。我该如何做到这一点？

Answer 1

的问题在于，文本坐落在文本基线上，而图像下降到低于此值。不同的浏览器以不同的方式处理。

我最喜欢的解决方案是将图像显示为background-image，其background-position设置为left center ...您可以季节品尝。

Answer 2

不知道，如果它是“最好”的答案，但我总是把我的文字的“行高”相匹配的是什么我试图居中的高度。

Answer 3

这里是垂直对齐中心。

http://www.templatespoint.com/blog/2010/10/div-vertical-align-middle/

或使用图像作为背景图像

背景：网址（bg_image.jpg）不重复左中心;