【VUE+Element】 show-overflow-tooltip内容过长时显示不全
发布日期:2021-05-17 18:00:28 浏览次数:16 分类:精选文章

本文共 469 字,大约阅读时间需要 1 分钟。

为了解决下拉菜单选项过长导致的滚动条问题,可以通过修改公共CSS来设置最大宽度,避免内部分布过于宽广。以下是具体的修改建议:

首先,针对el-select-dropdown容器元素,我们可以设置一个最大宽度,以确保下拉菜单在展开时不会超过预期范围。例如:

.el-select-dropdown {    max-width: 243px;}

接着,针对下拉菜单中的每个选项,可通过设置display: inline-block确保它们以默认方式在行内显示。这样可以避免选项内容叠加或溢出问题。

.el-select-dropdown__item {    display: inline-block;}

最后,为了确保每个选项的最小宽度达到规范,可以单独设置选项内部的内容宽度。例如:

.el-select-dropdown__item span {    min-width: 205px;}

通过以上设置,可以有效解决下拉菜单选项内容过长导致的渲染问题。这样一来,下拉菜单将在显现时自动撑开,而不会出现滚动条,确保用户体验的流畅性。

上一篇:【React+AntD】1、关于左侧文件夹最重点的详解
下一篇:IE浏览器中input的placeholder不显示

发表评论

最新留言

能坚持,总会有不一样的收获!
[***.219.124.196]2025年04月25日 23时52分26秒