elementPlus中el-table的每列两行溢出隐藏怎么设置

el-table的每列两行溢出隐藏怎么设置

elementPlus中的el-table如何设置多行溢出隐藏

这里是elementPlus的官方文档地址 https://element-plus.org/zh-CN/component/table.html

table中的table属性中有show-overflow-tooltip属性,但是只支持单行溢出隐藏

如何改成两行呢?

在审查元素中我们发现.el-tooltip这个类名是溢出隐藏的样式,原本的样式为

我们只需要更改样式即可如下:

css 复制代码
// 超出两行溢出隐藏真实悬浮提示
.el-table .cell.el-tooltip {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	line-clamp: 2;
	-webkit-line-clamp: 2;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal !important;
}

更改完之后的审查元素

致此完成

相关推荐
ly76896 小时前
HTML5 从入门到工程实践:语义化、表单、多媒体、性能与项目规范详解
前端·html·html5
人民广场吃泡面9 小时前
前端该重视的编程思想
前端
冬夜戏雪10 小时前
agent的trace 和eval
开发语言·前端·javascript
IT_陈寒10 小时前
Redis的DEL命令居然没删干净数据?这个坑我爬了半天
前端·人工智能·后端
kyriewen10 小时前
面试官让我现场用 AI 改一个真实 bug——他打断我的 3 个理由
前端·面试·ai编程
计算机魔术师11 小时前
斯坦福研究:AI 对入门级岗位冲击最大
前端
感谢一路走过的人11 小时前
AGGrid刷新数据后执行筛选
javascript·ag-grid
水獭比特11 小时前
工具都批准了,为什么还不能执行?给 Agent 补上第二道校验
javascript·人工智能·node.js