1.element table 表格 修改背景為透明并去除邊框

.el-table{ /* 表格字體顏色 */ color:white; /* 表格邊框顏色 */ /* border: 0.5px solid #758a99; */ height: 500px; } /* 表格內(nèi)背景顏色 */ .el-table th, .el-table tr,.el-table td{ border: 0; background-color: transparent; } /* 雙數(shù)行背景顏色 */ .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; }

　　效果圖：

?

轉(zhuǎn)載于:https://www.cnblogs.com/sweeeper/p/11242275.html

總結(jié)

以上是生活随笔為你收集整理的设置element表格透明样式的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。