如何对齐表格答案

【问题标题】：How do I Align a table如何对齐表格
【发布时间】：2015-03-13 20:42:50
【问题描述】：

我的网页上有一个表格，它自动向左对齐，文本在中心对齐，这是我想要的，但我无法让表格与页面中心对齐。

<table style="border: 1px solid black;  width:300px">
    <tr>

            <td colspan="2">
                <b>&nbsp;Change Your Passwordsword</b>
                </td>
                </tr>
                <tr>
            <td>
                New Password: 
            </td>    
             <td>
                <input type="password" id="pwd1" name="pwd1" size = "8" />&nbsp;
              </td>
            <tr>
            <td>
            Confirm Password: 
            </td>
                    <td>

                <input type="password" id="pwd2" size = "8" name="pwd2" />&nbsp;
              </td> 
            </tr>  
            <tr>
            <td>
            </td>
            <td>

                <input type="submit" value="Confirm" /></td>

            </tr> 
            <tr>
            <td>
            <asp:Literal ID="msg" runat="server" />
            </td>
            </tr>
            </table>

这是我的表格的代码。

【问题讨论】：

对齐<body>
见stackoverflow.com/questions/7059394/…

标签： html css visual-studio-2010

【解决方案1】：

使用以下 css 属性

table{
margin:auto;
}

<table style="border: 1px solid black;  width:300px">
    <tr>

            <td colspan="2">
                <b>&nbsp;Change Your Passwordsword</b>
                </td>
                </tr>
                <tr>
            <td>
                New Password: 
            </td>    
             <td>
                <input type="password" id="pwd1" name="pwd1" size = "8" />&nbsp;
              </td>
            <tr>
            <td>
            Confirm Password: 
            </td>
                    <td>

                <input type="password" id="pwd2" size = "8" name="pwd2" />&nbsp;
              </td> 
            </tr>  
            <tr>
            <td>
            </td>
            <td>

                <input type="submit" value="Confirm" /></td>

            </tr> 
            <tr>
            <td>
            <asp:Literal ID="msg" runat="server" />
            </td>
            </tr>
            </table>

【讨论】：

【解决方案2】：

JSFiddle

将align="center" 添加到<table>

【讨论】：

【解决方案3】：

随便用

margin: 0 auto;

它会让你的桌子居中。

检查：Fiddle。

【讨论】：

【解决方案4】：

要使表格居中，您需要设置边距，如下所示：

table.center { margin-left:auto; margin-right:auto; }

然后这样做：

<table class="center"> ... </table>

此时，Mozilla 和 Opera 将使您的表格居中。但是，Internet Explorer 5.5 及更高版本也需要您将其添加到 CSS 中：

body {text-align:center;}

【讨论】：