通过theadClasses属性设置表头样式。

thead-light设置灰色背景

//bootstrap table初始化数据  itxst.com
$('#table').bootstrapTable({
columns: columns,
data: getData(),
theadClasses: "thead-light",//这里设置表头样式
classes: "table table-bordered table-striped table-sm table-dark",
height:400
}); 

thead-dark设置黑色背景

//bootstrap table初始化数据
$('#table').bootstrapTable({
columns: columns,
data: getData(),
theadClasses: "thead-dark",//这里设置表头样式
classes: "table table-bordered table-striped table-sm table-dark",
height:400
});

自定义一个蓝色的表头样式

<style>
/*定义类名为.thead-blue的样式*/
.table .thead-blue th {
color: #fff;
background-color: #3195f1;
border-color: #0d7adf;
}
</style>
//bootstrap table初始化数据
$('#table').bootstrapTable({
columns: columns,
data: getData(),
theadClasses: "thead-blue",//设置thead-blue为表头样式
classes: "table table-bordered table-striped table-sm table-dark",
height:400
});  

转载:http://www.itxst.com/Bootstrap-Table/

theadClasses设置Bootstrap Table表头样式的更多相关文章

  1. rowStyle设置Bootstrap Table行样式

    日常开发中我们通常会用到隔行变色来美化表格,也会根据每行的数据显示特定的背景颜色,如果库存低于100的行显示红色背景 CSS样式 <style> .bg-blue { background ...

  2. bootstrap table的样式

    <style> table{ border: 1px solid #ddd; background-color: transparent; border-spacing:; border- ...

  3. Bootstrap Table的例子(转载)

    转载自:http://wenzhixin.net.cn/p/bootstrap-table/docs/examples.html#classes-table 使用的API: data1.json da ...

  4. bootStrap table 和 JS 开发过程中遇到问题汇总

    1..bootStrap-table表头固定 在table定义的时候给高度属性就可以自动生成滚动条,并且固定表头[height: 220,] 2.为动态生成的DOM元素绑定事件 on("cl ...

  5. bootstrap table使用小记

    bootstrap table是一个非常不错的,基于bootstrap的插件,它扩展和丰富了bootstrap表格的操作,如格式化表格,表格选择器,表格工具栏,分页等等. 最近基于bootstrap开 ...

  6. bootstrap table 超链接的添加 <a>标签

    后台管理页面采用 bootstrap table 页面样式: 现在需要在操作中添加一个<a>标签,跳转到不同的页面 { title: '操作', align: 'center', form ...

  7. bootstrap table 保留翻页选中数据

    $(function () { $('#exampleTable').on('uncheck.bs.table check.bs.table check-all.bs.table uncheck-al ...

  8. Bootstrap Table踩坑——设置多级表头后只显示第一级表头问题解决办法

    今天设置了Bootstrap Table的复杂表头,设置了多级表头(两行列名),但是只能显示第一级表头(第一行的列名),第二级的表头被第一级的表头覆盖.但是我仿照其他网上的其他设置复杂表头例子都能正常 ...

  9. 给bootstrap table设置行列单元格样式

    1.根据单元格或者行内其他单元格的内容,给该单元格设置一定的css样式 columns: [{ field: 'index', title: '序号', align:"center" ...

随机推荐

  1. uptime查看服务器运行时间

    uptime命令用于查看服务器运行了多长时间以及有多少个用户登录,快速获知服务器的负荷情况. uptime的输出包含一项内容是load average,显示了最近1,5,15分钟的负荷情况.它的值代表 ...

  2. TYVJ4239 [NOIP2015提高组DayT3]斗地主

    P2668 斗地主 题目描述 牛牛最近迷上了一种叫斗地主的扑克游戏.斗地主是一种使用黑桃.红心.梅花.方片的A到K加上大小王的共54张牌来进行的扑克牌游戏.在斗地主中, 牌的大小关系根据牌的数码表示如 ...

  3. JavaScript Libraries In A TypeScript Application, Revisited

    If you haven’t already gotten involved with it, you’ll probably know that TypeScript is becoming inc ...

  4. openpyxl 模块的使用

    参考博客:https://www.cnblogs.com/anpengapple/p/6399304.html?utm_source=itdadao&utm_medium=referral 在 ...

  5. mac Chrome 快捷键

    从windows迁移到mac,会发现快捷键真的变了,这里先吹一下mac OS天下第一 另外没有bar确实也提高了效率,这一点还是值的 其实程序员最常用的是检查,windows下是F12,默认F12会被 ...

  6. ThInkPHP验证码不显示,解决方法汇总

    出现ThInkPHP验证码不显示的情况 官方提示如下:如果无法显示验证码,请检查:① PHP是否已经安装GD库支持:② 输出之前是否有任何的输出(尤其是UTF8的BOM头信息输出):(打开验证码文件为 ...

  7. 【JZOJ4771】【NOIP2016提高A组模拟9.9】爬山

    题目描述 国家一级爬山运动员h10今天获得了一张有着密密麻麻标记的地图,在好奇心的驱使下,他又踏上了去爬山的路. 对于爬山,h10有一个原则,那就是不走回头路,于是他把地图上的所有边都标记成了有向边. ...

  8. iOS开发 底层抛析运行循环—— RunLoop

    http://blog.csdn.net/zc639143029/article/details/50012527 一.RunLoop基本概念 概念:程序的运行循环,通俗的来说就是跑圈. 1. 基本作 ...

  9. firefox扩展开发(一) : 扩展的基本结构

    用过firefox的人肯定要安装firefox的扩展,这样才能发挥火狐的全部实力.一般扩展是一个后缀为.xpi的文件,其实这个文件就是zip格式的压缩包,压缩了一个扩展所需要的所有目录和文件,基本的目 ...

  10. MySQL运算符和函数

    运算符 1.算数运算符 加(+):mysql> SELECT 1+1; 减(-):mysql> SELECT 3-2; 乘(*):mysql> SELECT 2*3; 除(/):my ...