element UI tabel表格改变边框颜色_修改el-table border颜色

element UI tabel表格改变边框颜色

1.改变最外层边框

 .el-table td, .el-table th.is-leaf,.el-table--border, .el-table--group{
        border-color: black;
    }
 .el-table--border::after, .el-table--group::after, .el-table::before{
        background-color: black;
    }
1
2
3
4
5
6

2.添加属性:cell-style=“cellStyle” 改变表格里面的边框颜色。

:header-cell-style="{color:‘black’,borderColor:‘black’}"，改变表头的边框颜色，

 <el-table :cell-style="cellStyle" :header-cell-style="{ color: 'black', borderColor: 'black' }"  height="200" :data="tableData" style="width: 100%" border >
     <el-table-column prop="date" label="序号" width="180" align="center">
     </el-table-column>
     <el-table-column prop="name" label="参数名称" width="180" align="center">
     </el-table-column>
</el-table>
 methods: {
    cellStyle({ row, column, rowIndex, columnIndex }) {
      return "height:35px!important; border-color:black!important; color:#000000!important; padding:0px!important; height:40px!important";
    },
    }
1
2
3
4
5
6
7
8
9
10
11