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

更改完之后的审查元素

致此完成

相关推荐
爱勇宝几秒前
《道德经》第5章:生产环境不相信眼泪
前端·后端·架构
掘金者阿豪4 分钟前
LEFT JOIN 凭空消失的背后,是优化器偷偷帮你做了决定
前端·后端
HackTwoHub13 分钟前
AntiDebug Mcp、AI逆向绕过前端,Hook 加密接口,抓取 Vue 路由漏洞,接入 MCP 让 AI 自动化挖掘前端漏洞
前端·vue.js·人工智能·安全·web安全·网络安全·系统安全
Mr_凌宇15 分钟前
AI 应用工程进阶扩展学习笔记 二
前端·面试
Hyyy28 分钟前
Git Worktree 完全讲解
前端·后端·面试
铁皮饭盒1 小时前
Bun 处理 IO 密集型比 Java 强多少?
javascript
李明卫杭州1 小时前
还在用 Vue2 的 $set?一文吃透 Observable 响应式原理与 Vue3 的 Proxy 重构
vue.js
anod1 小时前
Amazon反爬虫:一场从自动化到Chrome插件的折腾之旅
javascript·chrome·amazon·插件
葡萄城技术团队1 小时前
AI 不会淘汰电子表格,反而会让电子表格成为 AI 操作系统
前端·人工智能
BigTopOne1 小时前
Short Put and Short Call
前端