【问题标题】:how to add ellipsis in column of table如何在表格的列中添加省略号
【发布时间】:2015-07-08 03:15:49
【问题描述】:

我正在尝试在列中添加省略号。我正在使用带有角度 js 的离子框架。我在列中显示数据。但是当数据超过 2 或两行时,它应该显示“...”或省略号。我谷歌它找到了这个解决方案

CSS word ellipsis ('...') after one or two lines

但它不起作用,我找到了另一个解决方案 http://codepen.io/martinwolf/pen/qlFdp .它也不适合我

这是我的代码

http://plnkr.co/edit/BILpSThKHWZpKBqYIoQz?p=preview

.columnClass {

  margin: 0 auto;

  line-height: $line-height;
  -webkit-line-clamp: 2
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

有关此的任何更新

【问题讨论】:

  • 我认为它只有在你输入white-space:nowrap; 时才有效,但你不能用它来实现多行目的。我现在将研究解决方案。 codepen.io/anon/pen/zGWeNq

标签: javascript angularjs css angularjs-directive ionic-framework


【解决方案1】:

你可以试试这个解决方案:

https://github.com/josephschmitt/Clamp.js

它增加了对非 webkit 浏览器的兼容性。祝你解决问题。 用途:

$clamp(myHeader, {clamp: 3}); // 3 lines
$clamp(myParagraph, {clamp: "25px"}); // 25 pixels

祝你好运:)

【讨论】:

  • 为什么?如果您讨厌某些不想使用的插件,请将其列出,我们提供您的自定义解决方案
猜你喜欢
  • 2015-01-08
  • 1970-01-01
  • 1970-01-01
  • 2015-10-16
  • 1970-01-01
  • 2017-09-19
  • 2017-01-17
  • 2019-04-28
  • 1970-01-01
相关资源
最近更新 更多