css控制文本超出隐藏

本文主要介绍css实现文本单行和多行超出隐藏显示省略号。

一、单行超出隐藏

.ellipsis{
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

二、多行超出隐藏

.ellipsis-2 {
  display: -webkit-box;
  overflow: hidden;
  white-space: normal !important;
  text-overflow: ellipsis;
  word-wrap: break-word;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

将上述2改成任意数值n，即可实现n行超出隐藏