HTML：如何在表格中居中放置横幅？答案

【问题标题】：HTML: How do I center a banner in a table?HTML：如何在表格中居中放置横幅？
【发布时间】：2013-08-06 20:52:52
【问题描述】：

我已经很久没有使用 HTML（CSS 之前）了。基本上我是一个完整的菜鸟。我祈祷我能得到一些有用的信息。

有一些线程涵盖了这个问题，我已经使用了所有线程但没有成功，所以我假设这是我的样式格式中的问题，但我无法确定问题所在。这就是我现在的位置。

{

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html14/frameset.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>A Web Site</title>
        <style type="text/css">
        body {
            border-style:ridge;
            border-color:inherit;
            border-width:thin;
            background-color: beige;
            margin-left: 4px;
            margin-right: 4px;
            margin-top:3px;
            margin-bottom:3px;
            padding: inherit;
            font-family: Calibri;
            height:auto;
            width:auto;

            </style>

</head>
<body>
    <form id="form1" runat="server">
                <div id="Home Page">
                <table>
                   <tr><td align="center">
                      <img src="Some/pic.jpg">
                   </td></tr>

                </table>
                </div>


   </form>
</body>
</html>}

【问题讨论】：

标签： html image center

【解决方案1】：

你需要一个花括号。

//...
height: auto;
width: auto;
}

【讨论】：

谢谢。我还必须将 align="center" 放在标记中。显然继承了表格的格式。

【解决方案2】：

在width:auto;之后添加一个右大括号，如上一个答案中所述，在<img>上添加一个关闭标记，如</img>（或惰性关闭<img />），并删除@987654325之后的关闭大括号@。

<body>
    <form id="form1">
        <div id="Home Page">
            <table>
                <tr>
                    <td align="center">
                        <img src="Some/pic.jpg" />
                    </td>
                </tr>
            </table>
        </div>
   </form>
</body>

【讨论】：

【解决方案3】：

在 span 标签中添加你的文本，并应用 css 的 margin 属性。像例如

<span class="textCenter"> Hi This is text </span>

在 CSS 中：

.textCenter {
    margin-left:auto;
    margin-right:auto;
}

您可以相应地调整边距以使文本居中。在此处查看保证金属性：http://www.w3schools.com/css/css_margin.asp

【讨论】：