有时我们会有这样的需求：当文本内容较多，宽度超出父容器时，就在最后显示三个点，代表还有东西被折叠起来了。

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

第 2 行表示强制在一行显示;
第 3 行表示在溢出时显示省略标记（三个点）；
第 4 行表示溢出部分内容隐藏。

但有时我们需要实现多行文本末尾折叠，可以使用如下方法，但兼容性较差，可以用于移动端

在这里声明下，火狐和 IE 不支持的

p {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

第 5 行为要显示的行数