[elementui] el-table设置背景透明

原创已于 2024-02-29 10:09:04 修改 · 1.2k 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#elementui #vue.js #javascript

于 2024-02-29 10:04:30 首次发布

本文介绍了如何使用Vue.js的深度选择器修改ElementUI中的表格样式，包括删除背景色、调整th样式并移除底部白线。

		  ::v-deep .el-table,
          .el-table__expanded-cell {
            background-color: transparent;
          }

          ::v-deep .el-table tr {
            background-color: transparent !important;
          }
          ::v-deep .el-table__body td,::v-deep .el-table__header th,
          .el-table .cell {
            background-color: transparent;
          }
          ::v-deep .el-table::before {
            //去除底部白线
            left: 0;
            bottom: 0;
            width: 100%;
            height: 0px;
          }
          //th的样式
           ::v-deep .el-table__header th {
          font-weight: bold;
          font-size: 16px;
            }