设置elementui 表格表头header-row-class-name
时间: 2023-10-07 22:06:20 浏览: 464
Element Table的row-class-name无效与动态高亮显示选中行背景色
5星 · 资源好评率100%
你可以在 element-ui 表格组件中使用 `header-row-class-name` 属性来设置表头的自定义样式类名。
具体做法如下:
1. 在表格组件中添加 `header-row-class-name` 属性,并将其值设置为一个自定义的样式类名,例如 `my-header-row`:
```html
<template>
<el-table :data="tableData" header-row-class-name="my-header-row">
<!-- 表格列定义 -->
</el-table>
</template>
```
2. 在样式表中定义 `my-header-row` 样式类,设置表头的自定义样式:
```css
.my-header-row {
background-color: #f5f5f5;
font-weight: bold;
}
```
通过以上操作,就可以为 element-ui 表格组件的表头设置自定义样式类名,从而实现表头的自定义样式。
阅读全文