el-table设置透明背景、行样式

el-table设置表头样式使用header-cell-style，设置每行的样式使用cell-style

<div class="mytable" style="margin-top:10px;">
    <el-table class="productTable" :data="tableData" 
        :height=tableHeight
        :style="{fontSize:16+'px'}"
        :header-cell-style="{color:'#ffffff',textAlign:'center'}"
        :cell-style="{color:'#ffffff',textAlign:'center',fontSize:13+'px'}">
        <el-table-column label="序号" width="66">
            <template #default="scope">
                {{scope.$index + 1}}
            </template>
        </el-table-column>
        <el-table-column prop="LineCode" label="生产线" width="66" />
        <el-table-column prop="PO" label="订单号" />
        <el-table-column prop="ProCode" label="产品编码" />
        <el-table-column prop="ProModel" label="产品型号"  />
        <el-table-column prop="ProName" label="产品名称" />
        <el-table-column prop="QtyBad" label="不良数" width="66" />
        <el-table-column prop="QtyGood" label="良品数" width="66" />
        <el-table-column prop="TaskNo" label="工单号" />
        <el-table-column prop="RateOfOutput" label="达成率" width="66" />
        <el-table-column prop="QtyGood" label="良品数" width="66" />
        <el-table-column prop="RateOfGood" label="合格率" width="66" />
    </el-table>
</div>

el-table设置背景颜色透明

.mytable /deep/ .el-table th {
    background-color: transparent!important;
}
.mytable /deep/ .el-table tr {
    background-color: transparent!important;
}
.mytable /deep/ .el-table--enable-row-transition .el-table__body td, .el-table .cell{
    background-color: transparent;
}
.mytable .el-table, .el-table__expanded-cell {
background-color: transparent;
}
/* 去除底部白线 */
.el-table::before { 
	left: 0;
	bottom: 0;
	width: 100%;
	height: 0px;
}

设置鼠标移入时的背景颜色

.mytable /deep/ .el-table--enable-row-hover .el-table__body tr:hover > td {
    background-color: #1c1c1b4a !important;
}