如何使用element plus实现展示两行的文本,超出部分使用省略号
时间: 2024-05-16 16:12:13 浏览: 140
你可以使用 element-plus 中的 el-tooltip 组件,将要展示的文本放入 el-tooltip 中,同时设置其内容最大宽度和显示省略号。例如:
```
<el-tooltip effect="dark" placement="top">
<div style="max-width: 150px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">
这里是要展示的文本,超出部分将会显示省略号。
</div>
</el-tooltip>
```
其中,max-width 代表最大宽度,可以根据需求设置,overflow 和 white-space 可以保证文本超出部分隐藏,text-overflow: ellipsis 则代表使用省略号替换超出部分。
阅读全文