el-table 表头边框圆角

修改 el-table 表头边框为圆角样式
为了实现 el-table 表头的边框圆角效果，可以采用自定义 CSS 来覆盖默认样式。具体方法如下：
方法一：使用全局样式文件
可以在项目的全局样式文件中添加特定的选择器来调整表头单元格的 border-radius 属性。
/* 自定义表头单元格的圆角 */
.el-table th.is-leaf {
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
登录后复制
对于首列的特殊处理，可以通过增加额外的选择器来确保仅对该列应用圆角效果[^1]。
/* 针对首列的第一个和最后一个th元素设置不同的圆角半径 */
.el-table .cell:first-child {
border-bottom-left-radius: 8px !important;
}

.el-table thead tr th:nth-last-of-type(2) {
border-bottom-right-radius: 8px !important;
}
登录后复制
方法二：内联样式或 scoped 样式
如果希望作用范围更局限，则可以直接在组件内部通过 <style scoped> 定义局部样式，或者利用 inline-style 方式指定单个表格实例上的样式。
需要注意的是，在移除不需要的边框线条方面，可能还需要重置一些默认属性以防止多余的边框显现出来[^2]。
/* 移除整个表格以及各部分之间的内外边距与间距 */
.el-table,
.el-table__expanded-cell {
border: none;
}

.el-table td,
.el-table th.is-leaf {
border-bottom: none;
}
登录后复制
上述代码片段展示了如何有效地去除不必要的边框并设定所需的圆角效果。