带有多列的html列表项

Question

我正在努力创建一个由用户名和真实姓名组成的列表（例如jbloggs（Joe Bloggs）。我希望真实姓名在列中排成一行，但是当我添加{{1每个部分周围（见下文）列表搞砸了！有人知道怎么做吗？

<span class="col-xs-6">

我正在使用Bootstrap 3进行布局等。

Answer 1

我建议使用一个表格，这样做就可以了。

<table>
  <thead>
    <tr>
    <th>Username</th>
      <th>First name</th>
      <th>Last name</th>
      </tr>
    </thead>
  <tbody>
  <tr>
    <td>JSmith</td>
    <td>Jill</td> 
    <td>Smith</td>
  </tr>
  <tr>
    <td>EJackson</td>
    <td>Eve</td> 
    <td>Jackson</td>
  </tr>
    </tbody>
</table>

Answer 2

如果您仍想使用Bootstrap类，最简单的列列表方法是将网格类应用于<li>项本身。

<ul class="row">
    <li class="col-xs-6"></li>
    <li class="col-xs-6"></li>
</ul>

建议父.row
• ul摆脱col-xs-6类造成的左右边距。