左浮动图像后的垂直居中文本

时间:2012-07-31 13:22:12

标签: html css center

<img style="float:left" src="image.jpg"> <center>text</center>
<hr style="clear:both">

我想用上面的代码实现的是左边有一个图像,垂直居中的文本(而不是像当前一样放在顶部)和水平居中,然后是图像和文本之后是一个水平条,将图像和文本与我的其他东西分开。我不知道如何在不做像单行和列的表格那样时髦的东西的情况下垂直居中文本。

2 个答案:

答案 0 :(得分:2)

试试这个example

如果你的图像所在的区域有一个固定的高度,那么你可以给出

line-height = the height of the image将文字垂直放置在中心

编辑:another way

答案 1 :(得分:1)

<div>
<img style="float:left" src="image.jpg">text
</div>

img
{
  vertical-align:middle;
}