Question

我正在创建一个在Bootstrap中有5列的表。为了使它具有响应性，我使用了足够的主题。但是，如果我的列中的一个内容太大，则列变得非常大并且表不成比例。最好的方法是什么？

    <div class="container table-responsive">
        <table class="table table-striped toggle-circle-filled">
          <thead>
          <tr>
            <th  data-hide="phone, table">A</th>
            <th data-toggle="true">ID</th>
            <th data-hide="phone">C</th>
            <th data-hide="phone, tablet">D</th>
            <th>Status</th>
          </tr>
          </thead>
          <tbody>
          ....
          </tbody>
      </table>
</div>

Answer 1

尝试为每个列分配一个定义的宽度

示例 -

 <div class="container table-responsive">
        <table width=100% class="table table-striped toggle-circle-filled">
          <thead>
          <tr>
            <th  data-hide="phone, table">A</th>
            <th data-toggle="true">ID</th>
            <th data-hide="phone">C</th>
            <th data-hide="phone, tablet">D</th>
            <th>Status</th>
          </tr>
          </thead>
          <tbody>
          <tr>
          <td width="20%"></td>
          <td width="20%"></td>
          <td width="20%"></td>
          <td width="20%"></td>
          <td width="20%"></td>
          </tbody>
      </table>
</div>

使用Bootstrap＆amp;创建响应表。 Footable

1 个答案: