Vue + Element UI 设置表格背景色、删除表格线、设

/*设置table的背景色*/
.el-table, .el-table__expanded-cell {background-color: transparent !important;}
.el-table th, .el-table tr, .el-table td {background-color: transparent !important;}

/* 去掉中间数据的分割线 */
.el-table__row>td{border: none;}
/* 去掉上面的线 */
.el-table th.is-leaf{border: none;}
/* 去掉最下面的那一条线 */
.el-table::before {height: 0px;}

设置表格内容的样式、颜色

<el-table :data="table" :header-cell-style="thStyleFun"
                  :cell-style="cellStyleFun" class="main-table" @selection-change="selectRow">
            <el-table-column type="selection" width="50"></el-table-column>
            <el-table-column prop="nodeName" label="节点名称"></el-table-column>
            <el-table-column prop="nodeAlias" label="节点标识"></el-table-column>
            <el-table-column prop="nodeStatus" label="节点状态"></el-table-column>
            <el-table-column prop="parentNodeName" label="上级节点"></el-table-column>
            <el-table-column prop="nodeDetail" label="节点详情"></el-table-column>
            <el-table-column label="录入时间" align="center">
                <template slot-scope="scope">
                    <div style="white-space: pre;text-align: center;">{{scope.row.insertDate | dateFormat}}</div>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="130">
                <template slot-scope="scope">
                    <el-button type="text" @click="$router.push('/archive/'+scope.row.id)">详情</el-button>
                </template>
            </el-table-column>
        </el-table>

在method下设置想要的样式

// 设置表格内容居中
thStyleFun() {
    return 'text-align:center'
 },
 // 设置表格内容字体颜色
cellStyleFun() {
    return 'text-align:center;font-size: 14px;font-weight: bold;color:#55C2FF'
},