el-table的表头字体颜色设置示例代码
时间: 2023-10-06 13:08:06 浏览: 180
vue el-table实现自定义表头
好的,这是一个使用 `headerStyle` 属性来设置表头字体颜色的完整示例代码:
```html
<template>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="date" label="日期" width="180" :headerStyle="{color: 'red'}"></el-table-column>
<el-table-column prop="name" label="姓名" width="180"></el-table-column>
<el-table-column prop="address" label="地址"></el-table-column>
</el-table>
</template>
<script>
export default {
data() {
return {
tableData: [
{ date: '2021-01-01', name: '张三', address: '北京市' },
{ date: '2021-01-02', name: '李四', address: '上海市' },
{ date: '2021-01-03', name: '王五', address: '广州市' },
],
};
},
};
</script>
```
在这个例子中,我们将表头的日期列字体颜色设置为红色。你可以根据需要自定义其他样式属性,例如背景色、边框等等。
阅读全文