element ui el-table 多选表头多选框替换文字

Jim010101

于 2021-09-10 14:35:03 发布

阅读量1.5k

点赞数

分类专栏： VUE 文章标签： vue

本文链接：https://blog.csdn.net/qq_27946017/article/details/120221503

版权

VUE 专栏收录该内容

8 篇文章

订阅专栏

这篇博客介绍了如何使用CSS样式修改ElementUI的el-table组件，实现多选表头的全选文字替换，通过覆盖默认的checkbox内联元素并添加自定义内容，达到显示‘全选’字样的效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

element ui el-table 多选表头多选框替换文字

.el-table /deep/.DisabledSelection .cell .el-checkbox__inner {
	//   margin-left: -30px;
	display: none;
	position: relative;
}
.el-table /deep/.DisabledSelection .cell:before {
	content: '多选';
	position: absolute;
	right: 15px;
}

在这里插入图片描述

element ui el-table 多选表头增加全选字样

/*表格表头全选*/
	.el-table /deep/.DisabledSelection .cell .el-checkbox__inner{
	  margin-left: -30px;
	  position:relative;
	}
	.el-table /deep/.DisabledSelection .cell:before{
	  content:"全选";
	  position:absolute;
	  right:11px;
	}