twitter-bootstrap - 使用 Bootstrap & Footable 创建响应式表格

Question

我正在创建一个在 Bootstrap 中有 5 列的表。太让它响应我已经使用了footable主题。但是，如果我的列的内容之一太大，则列变得非常大并且表格不成比例。解决此问题的最佳方法是什么？

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