多行文本溢出 显示... 判断是否多行文本溢出

多行文本溢出后显示...下面只是其中一种纯css的解决办法，有一定的局限性，在于-webkit-line-clamp: 2这句语句，这句语句是webkit基于内核的一句语句，其他内核均无法使用。可是我专门列出来的原因是这个可以用于移动端，移动端暂时几乎都是基于webkit内核的浏览器，所以可以使用。

overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

使用上述css代码即可实现多行文本溢出显示...的效果。

---

 

这里还配套写了一个判断是否多行文本溢出了的js。

首先要记得定死高度height，不能是auto，这是纯js的代码。这个是多行的，单行的直接把height变为width即可。

div.scrollHeight==div.offsetHeight

如果用jquery的话，要这么用，如下：

div[0].scrollHeight ==div.height()

切记scrollHeight之前的dom元素之后要加[0]，不然一定出bug。

转载于:https://www.cnblogs.com/neuscx/p/4998010.html