el-table 背景色
时间: 2023-06-28 12:08:20 浏览: 125
vue3 el-table多级表头收缩扩展的实现(JS原味版)
您可以使用 `el-table` 的 `highlight-current-row` 属性来高亮当前行,或者通过设置 `even-row-class` 和 `odd-row-class` 属性来为偶数行和奇数行分别设置背景色。
例如,设置偶数行为灰色,奇数行为白色:
```html
<el-table :data="tableData" even-row-class="even-row" odd-row-class="odd-row">
<el-table-column prop="name" label="Name"></el-table-column>
<el-table-column prop="age" label="Age"></el-table-column>
</el-table>
```
```css
.even-row {
background-color: #f5f5f5;
}
.odd-row {
background-color: #ffffff;
}
```
或者设置高亮当前行的背景色:
```html
<el-table :data="tableData" highlight-current-row>
<el-table-column prop="name" label="Name"></el-table-column>
<el-table-column prop="age" label="Age"></el-table-column>
</el-table>
```
```css
.el-table__row--current {
background-color: #f5f5f5;
}
```
阅读全文