制表程序不接受标题颜色更改
通过下面的css,我试图改变我所有列的标题颜色,但是我没有得到这个调整
我试着这样做,但它不去。我用vue3 + vite +制表符5.4
<style scoped>
.tabulator {
font-size: 12px;
width: 100%;
}
.tabulator .tabulator-header,
.tabulator-col .headerBackgroundColor {
background-color: #acacac;
}
</style>
这是我的制表机
tabulator.value = new Tabulator('#tabulator', {
data: dataRelatorio.value,
layout: 'fitColumns',
autoResize: true,
pagination: 'local',
paginationSize: 20,
rowHeight: 25,
paginationSizeSelector: [10, 20, 30, 50, 100, 200, 500, 1000],
movableColumns: true,
paginationCounter: 'rows',
responsiveLayout: 'hide',
placeholder: 'No record found',
locale: 'pt-BR',
langs: {
'pt-BR': {
pagination: {
page_title: 'Show page',
first: 'First',
first_title: 'First page',
last: 'Next',
last_title: 'Next page',
prev: 'Previous',
prev_title: 'Previous page',
next: 'Next',
next_title: 'Next Page',
all: 'All',
},
},
},
columns: columns,
rowFormatter: function (row) {
//console.log(row.getData());
if (row.getData().in_delayed === 'delayed') {
const children = row.getElement().childNodes;
children.forEach((child) => {
child.style.backgroundColor = '#FFFACD';
});
}
},
});
1条答案
按热度按时间mklgxw1f1#
这应该行得通:
注:
<style>
标记上使用scoped
指令。<style>
标签,一些是scoped
标签,一些是常规标签。常规标签是 “normal” CSS,它们适用于整个DOM。scoped
样式标签中应用上面的样式。选择器很可能是.tabulator :deep(.tabulator-header .tabulator-col)
,但是我不能确定,除非你提供一个 runnable 最小的例子,这样我可以检查它。