Bootstrap-Table 入门案例

最新推荐文章于 2022-11-05 15:19:41 发布

程序员不弃

最新推荐文章于 2022-11-05 15:19:41 发布

阅读量767

点赞数

分类专栏：【BootStrap前端框架-table】文章标签： bootstrap table html

本文链接：https://blog.csdn.net/kye055947/article/details/79562370

版权

【BootStrap前端框架-table】专栏收录该内容

3 篇文章 0 订阅

订阅专栏

目录结构：

案例1：

 
  <!DOCTYPE html 
  > 
 
  <html> 
 
  <head> 
 
  <meta 
  charset= 
  "UTF-8" 
  > 
 
  <title>Insert title here 
  </title> 
 
  <script 
  type= 
  "text/javascript" 
  src= 
  "js/bootstrap-table.js" 
  ></script> 
 
  <script 
  type= 
  "text/javascript" 
  src= 
  "js/bootstrap-table-zh-CN.js" 
  ></script> 
 
  <link 
  href= 
  "css/bootstrap-table.css" 
  > 
 
  </head> 
 
  <body> 
 
  <p>通过Data属性的方式，无需编写JavaScript启用bootstrap table, 设置 data-toggle="table" 即可 
  </p> 
 
  <div 
  class= 
  "alert alert-danger" 
  > 
 
  <p>1.这种方式不太常用，因为分页不方便 
  </p> 
 
  </div> 
 
  <table 
  data-toggle= 
  "table" 
  > 
 
  <thead> 
 
  <tr> 
 
  <th>Item ID 
  </th> 
 
  <th>Item Name 
  </th> 
 
  <th>Item Price 
  </th> 
 
  </tr> 
 
  </thead> 
 
  <tbody> 
 
  <tr> 
 
  <td>1 
  </td> 
 
  <td>Item 1 
  </td> 
 
  <td>$1 
  </td> 
 
  </tr> 
 
  <tr> 
 
  <td>2 
  </td> 
 
  <td>Item 2 
  </td> 
 
  <td>$2 
  </td> 
 
  </tr> 
 
  </tbody> 
 
  </table> 
 
  </body> 
 
  </html>

程序员不弃

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Bootstrap-Table 入门案例

目录结构：案例1：&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;meta charset="UTF-8"&gt;&lt;title&gt;Insert title here&lt;/title&gt;&lt;script type="text/javascript" src="js/bootstrap-t
复制链接

扫一扫