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

2023-02-17,,,,

<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);
}

element-ui中table表格表头和表格内容都水平居中,以及斑马纹背景颜色修改的相关教程结束。

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

下载本文的Word格式文档,以方便收藏与打印。