bootstrap表格页面

Bootstrap表格（Bootstrap Table）是基于Twitter Bootstrap框架创建的一款轻量级、响应式的HTML数据表格插件。它允许您快速地在网页上展示表格数据，并提供了一些基本的样式和交互功能，如排序、搜索、分页等。使用Bootstrap Table，您可以轻松地定制表格的外观，比如添加列头、设置单元格样式、自定义事件处理等。以下是使用Bootstrap Table的基本步骤：

1. 引入必要的CSS和JS文件：

   <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css">
   <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
   <script src="https://cdn.bootcdn.net/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
   <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/bootstrap-table@1.18.3/dist/bootstrap-table.min.js"></script>

2. 创建基础表格结构：

   <table id="example-table" data-toggle="table" data-url="your-data-source"></table>

3. 初始化表格并配置选项（例如，数据显示源、表头等）：

   $('#example-table').bootstrapTable({
       url: 'your-api-url', // 数据请求地址
       columns: [
           { field: 'name', title: 'Name' },
           { field: 'age', title: 'Age' },
           // 更多列...
       ],
       search: true,
       pagination: true
   });