headClasses设置Bootstrap Table表头样式

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

thead-light设置灰色背景 

//bootstrap table初始化数据 by 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
});

  参考： http://www.itxst.com/Bootstrap-Table

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

<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
});

最后

以上就是大气溪流为你收集整理的headClasses设置Bootstrap Table表头样式的全部内容，希望文章能够帮你解决headClasses设置Bootstrap Table表头样式所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。