Question

我用html和twitter bootstrap创建一个表。但是表条目有点混乱。我想知道如何将它们对齐以均匀分布

<table class="table">
  <tr class="ass testPageRow">
    <td id="tp1">1</td>
    <td id="tp4">4</td>
    <td id="tp5">5</td>
  </tr>

  <tr class="ass testPageRow">
    <td id="tp12">12</td>
    <td id="tp13">13</td>
    <td id="tp14">14</td>
  </tr>

  <tr class="ass testPageRow">
    <td id="tp14TTU">14TTU</td>
    <td id="tp15">15</td>
    <td id="tp16">16</td>
  </tr>

  <tr class="ass testPageRow">
    <td id="tp18">18</td>
    <td id="tp20">20</td>
    <td id="tp21">21</td>
  </tr>

  <tr class="ass testPageRow">
    <td id="tp22">22</td>
    <td id="tp23">23</td>
    <td id="tp24">24</td>
  </tr>

  <tr class="ass testPageRow">
    <td id="tp25">25</td>
    <td id="tp26">26</td>
    <td id="tp27">27</td>
  </tr>

  <tr class="ass testPageRow">
    <td id="tp28">28</td>
    <td id="tp29">29</td>
    <td id="tp30">30</td>
  </tr>
</table>

Answer 1

根据表格中的列数设置<td>元素的宽度。

table {
    width:100%;
}

td {
    width:33%; // 3 evenly sized columns
}

http://jsfiddle.net/jv3hr7LL/

与Twitter bootstrap <table> </table>均匀间隔

1 个答案: