首页 > 其他分享 >el-table样式修改

el-table样式修改

时间:2024-10-17 10:49:57浏览次数:7  
标签:__ el 样式 deep cell background table

// table样式
// 表头
:deep(.el-table th) {
    background-color: transparent;
    background: #1650ad !important;
    background-size: 100% 100%;
}
/* 修改表头文字颜色 */
:deep(.el-table .cell) {
    color: #ffffff;
}
// 去除头部边框线
:deep(.el-table td.el-table__cell,.el-table th.el-table__cell.is-leaf){
    border-bottom: none !important;
}
// 表格格栅的第一种颜色
:deep(.el-table tr){
    background:#0d2852;
}
:deep(.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell){
    background:#063d8f;
}
// 表格格栅的第er种颜色
:deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell){
    background:#063279;
}
// 去除body部边框线
:deep(.el-table td.el-table__cell,.el-table th.el-table__cell.is-leaf){
    border-bottom:none !important;
}

标签:__,el,样式,deep,cell,background,table
From: https://www.cnblogs.com/baozhengrui/p/18471578

相关文章

  • el-select 下拉搜索框
    //搜索框下拉:deep(.el-select__placeholder.is-transparent){color:#fff!important;font-size:1rem!important;}:deep(.el-select__placeholder){color:#fff!important;font-size:1rem!important;}:deep(el-select__caret){color:#fff!imp......
  • 界面控件Telerik UI for WPF 2024 Q3亮点 - 支持禁用数据过滤等
    TelerikUIforWPF拥有超过100个控件来创建美观、高性能的桌面应用程序,同时还能快速构建企业级办公WPF应用程序。UIforWPF支持MVVM、触摸等,创建的应用程序可靠且结构良好,非常容易维护,其直观的API将无缝地集成VisualStudio工具箱中。本文将介绍界面组件TelerikUIforWPF在今......
  • el-cascader 级联选择器清空初始化
    解决方案判断输入框为空值之后做以下操作恢复到初始化状态: this.$refs.myCascader.$refs.panel.checkedValue=[];//清空选中值this.$refs.myCascader.$refs.panel.clearCheckedNodes();//清空级联选择器选中状态this.$refs.myCascader.$refs.panel.activePath=[]......
  • Selenium 进阶技巧:实现 Web 端的鼠标操作功能
    此文章来源于项目官方公众号:“AirtestProject”版权声明:允许转载,但转载必须保留原链接;请勿用作商业或者非法用途一、前言大家在做selenium测试时,是否会遇到在网页上需要执行一些鼠标操作,如右键选择一些设置,或者双击点赞,双击放到屏幕等等,但是在日常使用中还是习惯使用selenium......
  • 本地运行vercel模板项目vercel/nextjs-postgres-auth-starter
    官方指南链接:https://vercel.com/templates/next.js/prisma-postgres-auth-starter创建项目create-next-appnpxcreate-next-appnextjs-typescript-starter--example"https://github.com/vercel/nextjs-postgres-auth-starter"进入nextjs-typescript-startercdnextj......
  • ThreeJS入门(123):THREE.Skeleton 知识详解,示例代码
    作者:还是大剑师兰特,曾为美国某知名大学计算机专业研究生,现为国内GIS领域高级前端工程师,CSDN知名博主,深耕openlayers、leaflet、mapbox、cesium,webgl,ThreeJS,canvas,echarts等技术开发,欢迎加微信(gis-dajianshi),一起交流。查看本专栏目录-本文是第123篇入门文章......
  • 在调试网页 JavaScript 脚本时,遇到 Error: Incorrect contents fetched, please reloa
    在调试网页JavaScript脚本时,遇到Error:Incorrectcontentsfetched,pleasereload这样的错误,通常表明网页内容的获取过程出现了问题。这种错误一般与页面加载、缓存管理、网络请求、脚本执行顺序等因素密切相关。为了更详细地分析问题,处理并解决这一错误,下面将从多个......
  • 机器学习(MachineLearning)(8)——模型评估与优化
    机器学习(MachineLearning)(1)——机器学习概述机器学习(MachineLearning)(2)——线性回归机器学习(MachineLearning)(3)——决策树回归机器学习(MachineLearning)(4)---------分类_逻辑回归机器学习(MachineLearning)(5)——分类_决策树机器学习(MachineLearning)(6)——分类_支持向量机机......
  • 深入理解Java并发读写锁—ReentrantReadWriteLock
    ReentrantReadWriteLock使用场景ReentrantReadWriteLock是Java的一种读写锁,它允许多个读线程同时访问,但只允许一个写线程访问(会阻塞所有的读写线程)。这种锁的设计可以提高性能,特别是在读操作的数量远远超过写操作的情况下。在并发场景中,为了解决线程安全问题,我们通常会......
  • 如何在CSS中修改滚动条样式
    修改滚动条样式在CSS中是一个有趣而常见的需求,特别是当你希望网页设计更加个性化时。虽然并不是所有浏览器都完全支持修改滚动条样式,但我们可以使用一些专门的CSS选择器来控制滚动条外观。以下是一个详细讲解,适合整理成博客发布。如何在CSS中修改滚动条样式在网页设计中,......