table-responsive有什么用

`table-responsive` 是 Bootstrap 框架提供的一个 CSS 类，用于使 HTML 表格适应不同的屏幕尺寸和设备类型。它可以让表格在小屏幕设备上水平滚动，以避免表格变形或超出屏幕范围。

使用 `table-responsive` 类的方式是将其应用于包含 HTML 表格的父元素。当表格父元素的宽度小于表格本身的宽度时，`table-responsive` 会自动添加水平滚动条，并且可以通过媒体查询和 CSS 样式来调整滚动条的样式和行为。

示例代码：

<div class="table-responsive">
  <table class="table">
    <thead>
      <tr>
        <th>#</th>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Username</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>1</td>
        <td>Mark</td>
        <td>Otto</td>
        <td>@mdo</td>
      </tr>
      <tr>
        <td>2</td>
        <td>Jacob</td>
        <td>Thornton</td>
        <td>@fat</td>
      </tr>
      <tr>
        <td>3</td>
        <td>Larry</td>
        <td>the Bird</td>
        <td>@twitter</td>
      </tr>
    </tbody>
  </table>
</div>

在这个例子中，`table-responsive` 类被应用于包含表格的 `<div>` 元素中，这样表格就可以在小屏幕设备上自适应并添加水平滚动条了。