如何對齊表格

Question

我的網頁上有一張桌子，它會自動向左對齊，文字在中心對齊，這正是我想要的，但是我無法使桌子與頁面的中心對齊。

<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>

這是我的桌子的代碼。

Answer 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> 

Answer 2

JSFiddle

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

Answer 3

只需使用

margin: 0 auto;

它將使您的桌子居中。

檢查： 提琴 。

Answer 4

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

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

然后執行以下操作：

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

此時，Mozilla和Opera將使您的桌子居中。 但是，Internet Explorer 5.5及更高版本也需要將其添加到CSS中：

body {text-align:center;}