在一行中对齐文本？

Question

我有问题，试图让这个文本显示在一行，而不是3行。

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

文本以不同的线出现，因此警察在一条线上，手推车在第二条线上，常见问题在另一条线上，但是它们仍然保持左、中、右排列。

如何将它们显示在同一条线上，但仍然对齐？

Answer 1

//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;
    }

Answer 2

你可以做几件事。

首先您可以像这样添加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>

Answer 3

尝试使用浮点数：

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