element plus 表格自定义圆角边框

最新推荐文章于 2025-05-02 11:10:28 发布

原创最新推荐文章于 2025-05-02 11:10:28 发布 · 570 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

这里不加border属性

<el-table class="mt24" style="height: 100%;" :data="tableData">
...
<el-table>

css:

/* 表格 */
.d_portrait_table{min-height:436px;}
.d_portrait_table .el-table thead th{height:50px;background-color:#F2F7FF !important;}


/* 主要代码 */
.d_portrait_table .el-table{/* --el-table-border-color:#D0E2FF !important;*/
 /* border-radius:6px;*/
 border:1px solid #D0E2FF;border-radius:6px;box-sizing:content-box;}
.d_portrait_table .el-table .el-table__cell{border-bottom:none;border-right:1px solid #D0E2FF;border-top:1px solid #D0E2FF;box-sizing:content-box;}
.d_portrait_table .el-table thead .el-table__cell{border-top:none;border-bottom:none;}
.d_portrait_table .el-table .el-table__cell:last-child{border-right:none;}
.d_portrait_table .el-table__inner-wrapper::before{display:none;}

效果