The element table component sets the style of a column and a row of the header separately

Requirements: It is necessary to set the style of a separate table (a row and a column) in the header.
Workaround:el-table Using header-cell-stylethe attribute of the will do the trick.

code:

Inside the HTML part of the code
header-cell-style is a method for setting the style of the header.

<el-table :data="item.data.size" :header-cell-style="tableHeaderColor">
</el-table>

In the JS part of the code
method, you can find the corresponding row and column through the index.

methods: {
    
    
   tableHeaderColor({
     
      row, column, rowIndex, columnIndex }) {
    
    
   		// 这里是对行和列的判断
       if (rowIndex === 2 && columnIndex === 2) {
    
    
       		// 返回的就是需要设置的CSS样式
           return "color:#ff4c4c;"; //字体红色
       } else if (rowIndex === 2 && columnIndex === 3) {
    
    
           return "color:#ff4c4c;"; //字体红色
       }
   },
}

Show results