将文本对齐一行？答案

【问题标题】：Align text in one line?将文本对齐一行？
【发布时间】：2013-11-21 04:12:15
【问题描述】：

我在尝试将此文本显示在一行而不是 3 行时遇到问题。

<h2 style="text-align:left">Policy</h2> 
<h2 style="text-align:center">Cart</h2> 
<h2 style="text-align:right">FAQ</h2>

文本出现在不同的行中，因此 Police 在一行，Cart 在第二行，FAQ 在另一行，但是它们仍然保持左、中和右对齐。

如何将它们显示在同一行但仍然对齐？

【问题讨论】：

你为什么不使用这个列表？
- 政策
- 购物车
- 常见问题

标签： html css text alignment

【解决方案1】：

你可以做一些事情。

首先你可以像这样添加display: inline-block;，

h2 {
    display: inline-block;
}

或者像这样，

<h2 style="display: inline-block;">Blah Blah</h2>

现在你也可以像这样浮动它们，

h2 {
    float: left;
}

或者像这样，

<h2 style="float: left;">Blah Blah</h2>

【讨论】：

【解决方案2】：

尝试使用浮点数：

<h2 style="text-align:left;float:left;">Policy </h2>
<h2 style="text-align:center;float:left;">Cart </h2>
<h2 style="text-align:right;float:left;">FAQ</h2>

【讨论】：

【解决方案3】：

//Use list

  <ul class="footer">
     <li>Policy</li>
     <li>Cart</li>
     <li>FAQ</li>
    </ul>

//In the css

    .footer{
      width:100%
      float:left;
    }
    .footer li{
      display:inline;
      margin-right:20px;
    }

【讨论】：

【解决方案4】：

使用表格。

<center>
    <table>
        <tr>
        <td align="center" valign="center" cellspacing="0" cellpadding="0" border="0">
        <h2>&nbsp;<a href="put href here">Policy</a>&nbsp;<a href="put href                          here">Cart</a>&nbsp;<a href="put href here">FAQ</a>&nbsp;</h2>
        </td>
        </tr>
    </table>
</center>

【讨论】：

最简单的方法，添加更多如果你愿意。
你为什么建议table？这是一个糟糕的解决方案。
是的，它可能会起作用，但它不再是 1990 年了。 Tables 从来没有用于结构，现在有很多不同的选项可供使用，它们永远不应该用于结构。

【解决方案5】：

在 css 中使用 width:500% 根据您基于填充的任何百分比都可以。根据您尝试宽度百分比的值....但是宽度属性肯定会起作用..这是保证

【讨论】：