1. HTTP3W博客首页
  2. 技术
  3. vue

el-table表格超出部分显示省略号,去掉鼠标悬浮显示

1.el-table是有这个控制属性的::show-overflow-tooltip=“true”

<el-table-column align='center' prop="description" label="描述" min-width="280" 
:show-overflow-tooltip="true"></el-table-column>

2.如果需要去掉鼠标悬浮显示的全部内容可以设置样式,因此需要修改一下。注意:如果style里面使用了scoped属性,则样式会设置不成功,可以去掉scoped或者在页面中再加上一个style。

<style>
  .el-tooltip__popper{ max-width:20%; }
  .el-tooltip__popper{
  		display: none; //去掉悬浮显示
	}
</style>

div或者p标签单行和多行超出显示省略号

单行文本溢出显示省略号
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;

多行文本显示省略号
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

原文链接:https://blog.csdn.net/cc6_66/article/details/115545655

1、原创文章,作者:诺米,如若转载,请注明出处:https://www.http3w.com/archives/589

2、本站内容若有雷同从属巧合,若侵犯了您的权益,请联系本站删除,E-mail: wtao219@qq.com

发表评论

您的电子邮箱地址不会被公开。

联系我们

254007489

在线咨询:点击这里给我发消息

邮件:wtao219@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息