BootStrap表格固定列,固定左侧列以及右侧列

可以通过使用 BootStrap 的插件 DataTables 实现表格固定列、固定左侧列以及固定右侧列的效果。

首先，在 HTML 文件中引入 DataTables 的 CSS 和 JavaScript 文件：

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.22/fh-3.1.8/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.22/fh-3.1.8/datatables.min.js"></script>

然后，在表格的 `<table>` 标签上添加 `id` 属性，如：

<table id="myTable">
  <!-- 表格内容 -->
</table>

接着，在 JavaScript 文件中初始化 DataTables 插件，并设置固定列、固定左侧列和固定右侧列的参数：

$(document).ready(function() {
  $('#myTable').DataTable({
    fixedColumns: {
      leftColumns: 1, // 固定左侧一列
      rightColumns: 1 // 固定右侧一列
    },
    scrollX: true // 开启水平滚动条
  });
});

这样，就可以实现表格固定列、固定左侧列和固定右侧列的效果了。需要注意的是，固定列的数量不能超过表格的列数。