element-ui中table表格表头和表格内容都水平居中,以及斑马纹背景颜色修改

<el-table
   :data="detalData"
   stripe  //斑马纹
   border
   :header-cell-style="{textAlign: 'center'}"   // 表头水平居中
  :cell-style="{ textAlign: 'center' }"       //表格内容水平居中
   style="width: 100%">
     <el-table-column
        prop="date"
        label="序号"
     >
   </el-table-column>
</el-table>

二. 斑马纹的设置

::v-deep .el-table .el-table__body tr.el-table__row td{
  background: rgba(79, 218, 255, 0.18000000715255737);
}
::v-deep .el-table--striped .el-table__body tr.el-table__row--striped td{
  background: rgba(79, 218, 255, 0.05000000074505806);
}

 

 

posted @ 2021-12-09 17:09  IT小姐姐  阅读(2108)  评论(0)    收藏  举报