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

更改完之后的审查元素

致此完成

相关推荐
铁皮饭盒3 分钟前
网页端OCR, 加载6mb大小模型, 又快又准, 百度这次真香
前端·后端
Web极客码19 分钟前
如何在WordPress中添加动态内容
服务器·前端·wordpress
云浪30 分钟前
给 AI Agent 加上语音交互:ASR + 流式 TTS 实战
前端·人工智能·后端
晓得迷路了41 分钟前
栗子前端技术周刊第 140 期 - pnpm、Node 新 API 文档网站、Oxlint...
前端·javascript·node.js
烬羽1 小时前
一个队列,怎么让滑动窗口从 O(nk) 变 O(n)?单调队列彻底搞懂
javascript·数据结构·算法
weixin_3823952310 小时前
为小工厂量身打造:本地部署的物料管理系统带缺料计算
前端·制造
__zRainy__10 小时前
解决pnpm v10+不自动构建
前端·pnpm·工程化
猫猫不是喵喵.11 小时前
Vue3 Props 属性
前端·javascript·vue.js
醉城夜风~12 小时前
CSS元素显示模式(display)
前端·css
AI大模型-小华13 小时前
Codex 三方充值快速入门指南
java·前端·数据库·chatgpt·ai编程·codex·chatgpt pro