css三个点显示3行

CSS中，有一种很有用的功能——三个点显示三行。这个功能可以让长段落在不占用太多空间的情况下，展示其重要部分。

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

在上面的代码中，我们使用了以下属性：

• overflow: hidden;：表示隐藏文字超出部分的内容。
• text-overflow: ellipsis;：表示超出部分的内容用三个点代替。
• display: -webkit-box;：表示将文本内容按照box方式显示。
• -webkit-box-orient: vertical;：表示将box纵向排列。
• -webkit-line-clamp: 3;：表示最多显示3行。

通过使用这些CSS属性，我们便完成了三个点显示三行的效果。

需要注意的是，这个功能只对部分浏览器支持。在比较老旧的浏览器下，三个点可能无法正确显示。因此我们需要慎重考虑使用。