css3超出两行显示省略号

CSS3中提供了一个很实用的功能，就是超出两行显示省略号。当我们需要在页面中显示大段文字时，为了保持页面的美观，我们有时需要限制所显示的内容的行数。如果内容超出了规定行数，我们希望能够以省略号的形式表示，这时超出两行显示省略号就十分有用。

.ellipsis-2 {
    display: -webkit-Box;
    -webkit-Box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

以上代码就是实现超出两行显示省略号的CSS代码。解释如下：

1.设置弹性布局：display: -webkit-Box;

2.设置弹性方向：-webkit-Box-orient: vertical;

3.设置行数：-webkit-line-clamp: 2;

4.内容溢出隐藏：overflow: hidden;

5.省略号：text-overflow: ellipsis;

以上是完整的CSS代码，需要在HTML文件中指定相应的类名，并包裹需要省略的内容。

通过以上的CSS代码，我们就可以实现超出两行显示省略号的效果。这个功能很好地解决了在页面中显示大段文字时的美观问题，帮助我们更好地呈现页面内容。同样的，我们也可以根据需要自定义显示的行数，只需要将“2”改为需要的行数即可。