当前位置: 首页 > news >正文

el-table表头修改文字或者背景颜色,通过header-row-style设置样式

方式一

<el-table :header-cell-style="{'text-align': 'center'}" />

方式二

<template><el-table :header-cell-style="tableHeaderColor" />
</template>
<script>
export default {methods: {tableHeaderColor ({row, column, rowIndex, columnIndex}) {return 'background:	#F5F5F5; color:#000000;';}}
}
</script>//修改表头背景颜色为灰色字体为黑色

 如图

 

三、设置某个表头 (就是在第二点基础上加了判断)

<template><el-table :header-cell-style="tableHeaderColor" />
</template>
<script>
export default {methods: {// 设置表头的颜色tableHeaderColor({ row, column, rowIndex, columnIndex }) {console.log(row, column, rowIndex, columnIndex);if (rowIndex === 0 && columnIndex === 1) {return 'background-color: #afccfd; color:#000000;'; //蓝色} else if (rowIndex === 0 && columnIndex === 2) {return 'background-color: #c0e33c; color:#000000;';//绿色} else if (rowIndex === 0 && columnIndex === 3) {return 'background-color: #fbc57b; color:#000000;';//橙色} else {return 'color:#000000; background: #ffffff;';}}}
}
</script>

http://www.lryc.cn/news/376897.html

相关文章:

  • web前端-CSS
  • u8g2 使用IIC驱动uc1617 lcd 字符显示只显示上半部分,不显示下半部
  • 单片机第五季-第八课:STM32CubeMx和FreeRTOS
  • 【Linux】进程控制1——进程创建和进程终止
  • 计算机图形学入门16:曲线
  • 【Ruby基础01】windows和termux中搭建Ruby开发环境
  • 2406c++,iguana动态反射
  • 干货分享——AB站帮你解决独立站收款难题
  • C++继承与派生
  • Survival Animations
  • Cargo 教程
  • linux中“PXE高效批量装机”
  • emm, ComfyUI的作者从Stability.AI离职了
  • Redis-五种数据结构之列表(ziplist、quicklist)
  • 记一次全设备通杀未授权RCE的挖掘经历
  • 【数据库编程-SQLite3(一)】sqlite3数据库在Windows下的配置及测试
  • YOLOv10改进 | 主干篇 | YOLOv10引入华为VanillaNet替换Backbone
  • C++ 迷宫问题
  • 【Linux】Linux文件系统中主要文件夹列举_作用说明
  • 移植案例与原理 - HDF驱动框架-驱动配置(1)
  • 坚持刷题|反转链表
  • 升级和维护老旧LabVIEW程序
  • sqlite数据库整体迁移进mysql整个流程并解决中文异常问题
  • Hadoop3:MapReduce中的Partition原理及自定义Partition
  • 就因为没在大屏项目加全屏按钮,早上在地铁挨了领导一顿骂
  • STM32学习记录(八)————定时器输出PWM及舵机的控制
  • Vue CLI,Vue Router,Vuex
  • 互联网广告相关概念
  • 如何在服务器上部署一个java程序
  • 白酒:中国的酒文化的传承与发扬