css - 如何制作具有很多字段的响应表

Question

我尝试使用此表制作带有 Bootstrap 的响应表:

<table class="table table-striped table-bordered table-hover" id="dataTables-dokumen">
  <thead>
    <tr>
      <th>No</th>
      <th>Pertanyaan 1</th>
      <th>Pertanyaan 2</th>
      <th>Pertanyaan 3</th>
      <th>Pertanyaan 4</th>
      <th>Pertanyaan 5</th>
      <th>Pertanyaan 6</th>
      <th>Pertanyaan 7</th>
      <th>Pertanyaan 8</th>
      <th>Pertanyaan 9</th>
      <th>Pertanyaan 10</th>
      <th>Pertanyaan 11</th>
      <th>Pertanyaan 12</th>
      <th>Pertanyaan 13</th>
      <th>Pertanyaan 14</th>
      <th>Pertanyaan 15</th>
      <th>Pertanyaan 16</th>
      <th>Pertanyaan 17</th>
      <th>Pertanyaan 18</th>
      <th>Pertanyaan 19</th>
      <th>Pertanyaan 20</th>
    </tr>
  </thead>
  <tbody>
    //this is a value of table
  </tbody>
</table>

但是表格总是像这样穿过一条线:

如果我们在表格中有很多字段并且我们想制作一个响应式表格，有什么建议吗？

Answer 1

尝试 <table> 中的“table-responsive”类标签。您似乎正在使用数据表和 Bootstrap 。希望表格响应类可以解决您的问题。