使用表格的自定义属性名

最新推荐文章于 2025-04-28 14:06:58 发布

原创最新推荐文章于 2025-04-28 14:06:58 发布 · 541 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#html #css

注意：定义后的属性类名不能写在<style scoped>中，要新起一个<style>,不能生效的时候可以在样式属性后面加上！important

<el-table
  border
  :data="baseCurriculumDataList"
  style="width: 100%"
  :cell-style="{textAlign:'center'}"
  :header-cell-style="{textAlign:'center'}"
  :cell-class-name="setCellClassName"
  :header-cell-class-name="setHeaderRowClassName"
>

</el-table>

//给绑定学科一列设置背景颜色
setCellClassName({row, column, rowIndex, columnIndex}){
    if(columnIndex===1)
    {
      return 'setSubjectColumnName'
    }
},
//设置绑定学科的表头样式
setHeaderRowClassName({row, column, rowIndex, columnIndex})
{
  if(columnIndex===1)
  {
    return 'setHeaderSubjectColumnName'
  }
}

<style>
/*给绑定学科一列加背景颜色*/
.setSubjectColumnName{
  background-color: rgba(251,178,23,0.3);
}

.setHeaderSubjectColumnName{
  background-color: pink !important;
}

</style>