CSS实现单行、多行文本溢出显示省略号

CSS
Uiaoin 2019-05-28 4432

如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。

实现方法：

  1. overflow: hidden;
  2. text-overflow:ellipsis;
  3. white-space: nowrap;


但是这个只能实现单行文本的溢出显示省略号，如果我们要实现多行文本溢出显示省略号呢，CSS则需要这么写（以3行为例）：

  1. display: -webkit-box;
  2. -webkit-box-orient: vertical;
  3. -webkit-line-clamp: 3;
  4. overflow: hidden;


参考文章：http://www.daqianduan.com/6179.html

加载更多