Question

我需要将个人帐户移到中心位置并将对齐作为中心，但仍无法正常工作。我不知道哪里有滞后的地方。

<table cellspacing="1" cellpadding="0" width="750" align="center" bgColor="#000000" border="0">
  <tr>
    <td>
      <table cellspacing="0" cellpadding="0" width="750" align="center" bgcolor="#ffffff">
        <tr>
          <td width="34%" bgcolor="#ff0000" colspan="5">
            <div class="mainheader">Personal &amp; Account
            </div>
          </td>
          <td width="33%" bgcolor="#ff0000">
            <div align="right">
              <button class="button" id="btnLogin" accessKey="P" type="button" runat="server">Login&nbsp;</button>
            </div>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

Answer 1

确实如 j08691 的评论所述，请尝试避免使用表格进行布局。

要解决您的问题，我会保留您的表格布局，因为我想跟上您的问题的代码，但这是一个解决方案，首先删除第二个内部td - 因为您不需要它将按钮浮动到右侧。

我已将您的两列更改为一列，并在此列内插入了一个具有所需布局的div - 中间的文本和右侧的按钮。

该按钮在"float: right;"右侧浮动，文字与div的中心对齐"text-align: center"。尝试使用相同的方法进行未来的布局设计。

Here is a working example with the below code:

<table cellspacing="1" cellpadding="0" width="750" align="center" bgColor="#000000" border="0">
  <tr>
    <td>
      <table cellspacing="0" cellpadding="0" width="750" align="center" bgcolor="#ffffff">
        <tr>
          <td width="34%" bgcolor="#ff0000" colspan="5">
            <div class="mainheader" style="text-align: center">Personal &amp; Account
               <button class="button" id="btnLogin" accesskey="P" type="button" runat="server" style="float: right;">Login&nbsp;</button>            
            </div>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

Answer 2

<tr>
<td  bgcolor="#1f4e79" colspan="5">
                                <div class="mainheader" style="margin-left:325px;"  >Restraint &amp; Seclusion
                                </div>
                            </td>
                            <td width="33%" bgcolor="#1f4e79">
                                    <div align="right">
                                        <button class="button" id="btnLogin" accessKey="P" type="button" runat="server">Login&nbsp;</button>
                                    </div>
                                </td>
                        </tr>

无法将标题移动到中心，即使对齐也居中

2 个答案: