如何将文字放在图像下方

时间:2012-01-06 09:23:53

标签: html css text alignment

我想知道如何像图像一样在中心制作文字。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Title</title>
</head>

<body>
  <center>
    <img src="http://www.wikima4.com/assets/templates/wikima4/css/images/red.jpg" width=
    "1200" height="150" />
  </center>

  <div align="justified">
    <font size="3" face="calibri">text text text text The quick brown fox jumps over the
    lazy dog The quick brown fox jumps over the lazy dog The quick brown fox jumps over
    the lazy dog The quick brown fox jumps over the lazy dog The quick brown fox jumps
    over the lazy dog The quick brown fox jumps over the lazy dog<br />
    <br />
    You can download the documentation from this link: Download</font>
  </div>
</body>
</html>

2 个答案:

答案 0 :(得分:2)

text-align:center;<center>margin:0 auto

看看这个。 http://jsfiddle.net/VnRRA/这就是你想要的吗?

更新:http://jsfiddle.net/VnRRA/1/

基本上我做了什么,给了父div一个id centerize并告诉它text-align:center;

答案 1 :(得分:0)

为了对多个图像执行此操作,您还可以使用一行作为文本,另一行作为图像。使用此方法,您可以将文本放在图像的上方或下方。即。

<table>
    <tr>
        <td class="CSS Settings"> image 1 </td>
        <td class="CSS Settings"> image 2 </td>
        <td class="CSS Settings"> image 3 </td>
    </tr>
    <tr>
        <td class="CSS Settings"> Text for image 1 </td>
        <td class="CSS Settings"> Text for image 2 </td>
        <td class="CSS Settings"> Text for image 3 </td>
    </tr>
</table>