1

我有以下内容：

<p style="height: 25px; line-height: 25px;">
   <img width="16" height="16" src="/Content/images/icons/fugue/book-open.png" style="margin-top: 3px;">Test - 5</p>

我已经尝试了一些带有 line-height 的东西，但它似乎不起作用。文本总是只有几句话。

如何使图像的中心与文本的中心对齐？

所以我想要的是如下 xs 代表图像的地方：

xxx
xxx text
xxx
4

3 回答 3

2

您还没有说是要水平还是垂直排列元素，所以我将解释两者：

垂直对齐：
由于默认情况下图像是内联块，因此可以使用text-align. 只需在它们之间添加一个like-break ( <br/>) 或在图像中添加一个display: block.styling 并text-align: center在您的段落中使用。

看到它在 jsfiddle 上工作。

对于水平对齐：
最简单的解决方案是使用position: relative并向top:2px下移动图标。

看到它在 jsfiddle 上工作

于 2012-06-12T09:48:44.270 回答
0

您是否尝试设置vertical-align图像元素？

于 2012-06-12T09:48:48.103 回答
0

如果你设置一个vertical-align: middle;就img应该这样做！

注意：我已经从示例中删除了宽度和高度属性，但请参见此处：http: //jsfiddle.net/SZYtB/

于 2012-06-12T09:49:13.987 回答