elementUI設置表格懸浮樣式

<style>
/* 表格鼠標懸浮時的樣式（高亮） */
.el-table--enable-row-hover .el-table__body tr:hover {
  background-color: rgba(255, 255, 255, 0);
}
/*表格鼠標懸停的樣式（背景顏色）*/
.el-table tbody tr:hover > td {
  background-color: rgba(255, 255, 255, 0);
}
.el-table__body .el-table__row.hover-row td{
   background-color: rgba(255, 255, 255, 0);
}
</style>

上面的設置會影響全部的table，我們在 table 外邊包裹一個div，並設置類名，然后通過修改樣式，來達到只在某個頁面中修改

<div class="hovertable">
    <el-table>
        ......
    </el-table>
</div>

<style>
/* 表格鼠標懸浮時的樣式（高亮） */
.hovertable .el-table--enable-row-hover .el-table__body tr:hover {
  background-color: rgba(255, 255, 255, 0);
}
/*表格鼠標懸停的樣式（背景顏色）*/
.hovertable .el-table tbody tr:hover > td {
  background-color: rgba(255, 255, 255, 0);
}
/* 只要在 table 外邊包裹了 div.hovertable 則鼠標懸浮上去不會變色 */
.hovertable .el-table__body .el-table__row.hover-row td{
   background-color: rgba(255, 255, 255, 0);
}
</style>