1.实现无边框 <style scoped> /* 去除表格线 */ .el_table >>> .el-table__row>td{ border: none; } /* 去除上边框 */ .el_table>>> .el-table th.is-leaf { border: none; } /* 去除下边框 */ .el_table>>> .el-table::before{ height: 0; } </style> 2.实现当鼠标浮动到表格上时去掉el-table默认背景色 <style scoped> .el-table ::v-deep tbody tr:hover > td { background-color: #fff; } </style>
3.使用
<div class="el_table"> <el-table :data="tableData" :show-header="false" //去掉了表头 style="width: 100%"> //长度占50%的两列 <el-table-column prop="date" style="width:50%"> </el-table-column> <el-table-column prop="name" style="width: 50%"> </el-table-column> </el-table> </div>
4.实现效果