文本的中心主体但文本左对齐

时间:2015-07-17 16:21:46

标签: html html-table vertical-alignment text-align

我知道我错过了一个简单的线路修复。

我在<td align ="center">时尝试了<p style="text-align:left;">,反之亦然。我也为align="left"玩了简单的<p>

如何使所有文字都在&lt; td>中居中,但链接在中心左对齐?

enter image description here

到目前为止,文字左对齐但未在<td>

内居中

我还尝试添加一个居中的div,您将在我的代码中看到。没工作

        <td align="center" width="50%" style = "margin-left:50%">
        <p align="center"><font size="5"><b>Classified Ads</b></font></p>
        <br />

        <div align="center">

        <strong><!--edited 6/10/2015-->
                              <p style="text-align:left;">
                              <a href=".aspx">Search Classified Ads</a></p>                                  
                              <p style="text-align:left;">
                                 <a href=".aspx">Add or Delete Classified Ad</a></p>
                              <p style="text-align:left;">
                                 <a href=".aspx">Update Existing Classified Ad</a></p>
                              <p style="text-align:left;">
                                 <a href=".aspx">All Classified Ads</a></p>

                              <p style="text-align:left;">
                                 <a href=".aspx">About this Application</a></p>
         </strong>

        </div>
                              <p>
                                &nbsp;
                              </p>
                              <p>

                              </p>
                              <p align="center">
                              <strong>

                                    <font size="+1">Note: Classified Ads will expire after 30 days.</font>
                                    <br />
                                    Today&#39;s date is&nbsp;
                                  <asp:Label ID="DateLabel" runat="server"></asp:Label>
                              </strong>

                              </p>

    </td>

更新:

我似乎在解释我想要的错误。我希望它看起来像这样

enter image description here

1 个答案:

答案 0 :(得分:2)

<div>
        <p style="text-align:center"><font size="5"><b>Classified Ads</b></font></p>
        <br />

        <div style="width:300px; margin: 0 auto;">

            <strong><!--edited 6/10/2015-->
                <p>
                    <a href=".aspx">Search Classified Ads</a></p>                                  
                <p>
                    <a href=".aspx">Add or Delete Classified Ad</a></p>
                <p>
                    <a href=".aspx">Update Existing Classified Ad</a></p>
                <p>
                    <a href=".aspx">All Classified Ads</a></p>

                <p>
                   <a href=".aspx">About this Application</a></p>
            </strong>

        </div>
        <p>
        &nbsp;
        </p>
            <p style="text-align:center">
                  <strong>

                    <font size="+1">Note: Classified Ads will expire after 30 days.</font>
                    <br />
                    Today&#39;s date is&nbsp;
                </strong>

            </p>


        </div>

我认为这就是你所需要的。首先,当您使用align或text-align时,它将自动用于所有子元素。如果要对齐元素,只需对齐那些需要它的元素。第二件事是集中。您可以使用margin: 0 auto将块居中(您还需要定义宽度,否则它将无效)。

P.S :我强烈建议您不要在td之外使用table而不要使用align属性。阅读本文以编写更清晰的html:http://learn.shayhowe.com/html-css/