怎样修改el-table主题样式

起因:el-table有主题样式,部分需要单独设置

环境:idea+nodejs插件+谷歌浏览器

第一步:找到scss文件:

谷歌浏览器打开表格页面,ctrl+shift+i打开开发者工具,点击后鼠标移动到表格单元格上单击一下,看开发者工具styles,找到要修改样式对应的scss文件,在每个样式后面是文件路径和名称,特别要注意的是不要修改nodemodules下的scss文件,而是修改src下的scss文件。

第二步:添加新样式:在scss文件原样式位置同级添加一个新的样式,比如:

.el-table1 {

th.el-table__cell, td.el-table__cell {

background-color: transparent !important;

border: 1px solid #ebeef5;

.cell {

color: #000 !important;

}

}

}

第三步:添加class:<el-table class="el-table1"></el-table>

(全文完)

相关推荐
前端大卫15 分钟前
【重磅福利】学生认证可免费领取 Gemini 3 Pro 一年
前端·人工智能
孜燃26 分钟前
Flutter APP跳转Flutter APP 携带参数
前端·flutter
脾气有点小暴38 分钟前
前端页面跳转的核心区别与实战指南
开发语言·前端·javascript
lxh011344 分钟前
最长递增子序列
前端·数据结构·算法
vipbic1 小时前
我封装了一个“瑞士军刀”级插件,并顺手搞定了自动化部署
vue.js·nuxt.js
Youyzq1 小时前
前端项目发布到cdn上css被编译失效问题rgba失效和rgb失效
前端·css·算法·cdn
Caster_Z2 小时前
WinServer安装VM虚拟机运行Linux-(失败,云服务器不支持虚拟化)
linux·运维·服务器
Fantastic_sj2 小时前
Vue3相比Vue2的改进之处
前端·javascript·vue.js
vipbic2 小时前
解决npm publish的404/403和配置警告全记录
前端·npm·node.js
小小测试开发2 小时前
提升WebUI自动化效率与性能:从脚本到架构的全链路优化指南
运维·架构·自动化