单行文本省略号与多行文本省略号的实现

单行文本省略号

.demo {
  overflow: hidden;
  width: 100px;
  //white-word: nowrap;
  white-space: nowrap;

  text-overflow: ellipsis;
}

多行文本省略号

display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;

 在多行文本省略号时，如果添加了padding，line-hight就必须为字体大小的整数倍，否则底部会出现显示不完全的字体。

转载于:https://www.cnblogs.com/kugeliu/p/6322904.html