设置element表格透明样式
1.element table 表格 修改背景为透明并去除边框
.el-table{ /* 表格字体颜色 */ color:white; /* 表格边框颜色 */ /* border: 0.5px solid #758a99; */ height: 500px; } /* 表格内背景颜色 */ .el-table th, .el-table tr,.el-table td{ border: 0; background-color: transparent; } /* 双数行背景颜色 */ .el-table--striped .el-table__body tr.el-table__row--striped td { background-color:#fff; background-color: rgba(148, 144, 144, 0.3) } /* 使表格背景透明 */ .el-table th, .el-table tr { background-color: transparent; } /* 删除表格下横线 */ .el-table::before { left: 0; bottom: 0; width: 100%; height: 0px; } /* 表格表头字体颜色 */ .el-table thead { color: white; font-weight: 500; background-color: rgba(148, 144, 144, 0.3) }
效果:
2.效果2
/* 表格样式*/ .el-table__header th, .el-table__header tr { background:transparent; color: white; } .el-table--enable-row-hover .el-table__body tr:hover>td{ background: transparent !important; } .el-pager li.active { color: #080909; cursor: default; background-color: #17B3A3; border-radius: 2px; } .el-table th, .el-table tr { background-color: transparent; } .el-table th, .el-table tr,.el-table td{ background-color: transparent; } .el-table th:hover, .el-table tr:hover{ color: #4A95F6; background-color: darkgray!important; } .el-table--striped .el-table__body tr.el-table__row--striped.current-row td, .el-table__body tr.current-row>td, .el-table__body tr.hover-row.current-row>td, .el-table__body tr.hover-row.el-table__row--striped.current-row>td, .el-table__body tr.hover-row.el-table__row--striped>td, .el-table__body tr.hover-row>td { color: #4A95F6; background-color: darkgray!important; }
效果图:
设置element表格透明样式的更多相关文章
- css设置兼容的透明样式
css设置透明并实现兼容: <style>div{ filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; o ...
- [转]CSS如何设置html table表格边框样式
原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...
- 设置div背景透明的CSS样式
div背景透明样式: 样式代码: .alert{filter:alpha(opacity=100); /* IE */ -moz-opacity:1.0; /* Moz + FF */ opacity ...
- JavaScript(第二十天)【DOM操作表格及样式】
DOM在操作生成HTML上,还是比较简明的.不过,由于浏览器总是存在兼容和陷阱,导致最终的操作就不是那么简单方便了.本章主要了解一下DOM操作表格和样式的一些知识. 一.操作表格 <table& ...
- JavaScript--DOM操作表格及样式(21)
一 操作表格 // <table>标签是HTML中结构最为复杂的一个,我们可以通过DOM来创建生成它,或者HTMLDOM来操作它; // 使用DOM来创建表格; var table = d ...
- vue修改Element的el-table样式
修改Element中的el-table样式,可以使用以下几种方法: 1. row-style 行的 style 的回调方法,也可以使用一个固定的 Object 为所有行设置一样的 Style. 2. ...
- ch7对表单和数据表格使用样式
对数据表格应用样式 1.表格特有的元素 caption:基本上用做表格的标题.summary:可应用于表格的标签,用来描述表格的内容(与image的alt文本相似) <table class=& ...
- WPF DevExpress 设置雷达图Radar样式
DevExpress中定义的ChartControl很不错,很多项目直接使用这种控件. 本节讲述雷达图的样式设置 <Grid> <Grid.Resources> <D ...
- ExtJs 设置GridPanel表格文本垂直居中
业务场景,需要实现最终效果图如下: GridPanel代码如下配置: { xtype : 'grid', id : 'grid_jglb', frame : true, region : 'cente ...
随机推荐
- kafka centos安装发送消费消息
1. 请先下载安装文件,java环境需提前安装,解压到指定目录:tar -zxvf kafka_2.11-2.3.1.tgz -C /root/soft/ 从官网下载文件,上传到centos虚拟机指定 ...
- jmeter之图片上传
用jmeter来实现图片上传请求 目录 1.抓取参数 2.填写参数 1.抓取参数 第一步:先用fiddler抓取上传接口的参数 2.填写参数 第一步:在jmeter的参数列填写没有filename的这 ...
- Oracle系列:触发器、作业、序列、连接
.Net程序员学用Oracle系列(8):触发器.作业.序列.连接 1.触发器 2.作业 2.1.作业调度功能和应用 2.2.通过 DBMS_JOB 来调度作业 3.序列 3.1.创建序列 3.2 ...
- Vue作用域插槽:用作循环结构的模版
一 项目结构 二 App组件 <template> <div id="app"> <!-- 子组件 --> <todos :list=&q ...
- openssl使用
一. 加密方法 dsaffdfd fgggg 1.对称加密: 加密算法 + 口令 加密算法: DES(56bits),3DES(用des加密反复加密三次),AES(128bits),Blowfish ...
- EF - order by specific values
List<string> s = new List<string>() { "A", "家", "帮", " ...
- pandas分组聚合案例
美国2012年总统候选人政治献金数据分析 导入包 import numpy as np import pandas as pd from pandas import Series,DataFrame ...
- seaborn教程4——分类数据可视化
https://segmentfault.com/a/1190000015310299 Seaborn学习大纲 seaborn的学习内容主要包含以下几个部分: 风格管理 绘图风格设置 颜色风格设置 绘 ...
- hdu6341 Problem J. Let Sudoku Rotate (dfs)
题目传送门 题意: 给你16个16宫格的数独,里面是0~F,你可以逆时针旋转里面的每个16宫格 问你它是从标准数独逆时针旋转多少次得到? 思路: 可以知道每个16宫已经是标准的了,接下来只要考虑每行. ...
- python学习第二十五天函数位置参数和关键词参数
函数位置参数顾名思义就是按位置排序,按位置对应参数,位置一一对应,函数的关键词参数是不按照顺序来的,可以指定的参数传值.但是注意的是,位置参数必须在关键词参数之前. 1,函数位置参数 def good ...