屏幕尺寸较小时带有滚动条的引导表

Question

我有一个包含 8 列和几行的引导表，我想在屏幕尺寸减小时显示带有滚动条的表，否则该表会脱离包装布局。问题是滚动条一直显示，虽然它很丑，但我只想在必要时显示，我该怎么做？ 像这样使用jQuery插件会更好吗table collapse

<div class="panel-body">
        <div class="table-responsive">
            <div class="dataTable_wrapper">
                <table class="table table-striped table-bordered table-hover"
                    id="fleetsTable">
                    <thead>
                        <tr>
                            <th>Application</th>
                            <th>Cubic</th>
                            <th>Power</th>
                            <th>Euro class</th>
                            <th>Engine Type</th>
                            <th>Traction</th>
                            <th>Transmission</th>
                            <th>Cars</th>
                            <th>Add Car</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr th:each="fleet : ${fleets}" class="odd gradeX">
                            <td class="col-xs-2" th:text="${fleet.application}"></td>
                            <td class="col-xs-1" th:text="${fleet.cubic}"></td>
                            <td class="col-xs-1" th:text="${fleet.power}"></td>
                            <td class="col-xs-1" th:text="${fleet.euroClass}"></td>
                            <td class="col-xs-1" th:text="${fleet.engineType}"></td>
                            <td class="col-xs-2" th:text="${fleet.traction}"></td>
                            <td class="col-xs-2" th:text="${fleet.transmission}"></td>
                            <td class="col-xs-1"><button id="showCarsButton"
                                    type="button" class="btn btn-primary">Show cars</button></td>
                            <td class="col-xs-1"><button id="addCarButton"
                                    type="button" class="btn btn-primary">Add car</button></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <!-- /.panel-body -->
    </div>

Answer 1

使用这个 表格样式=“溢出：自动”