默认显示两行文字，多余的文字省略掉，变成省略号

display: -webkit-box;

-webkit-line-clamp: 2;

-webkit-box-orient: vertical;

overflow: hidden;

text-overflow: ellipsis;

1.display:-webkit-box:这个属性的意思是将元素的显示模式设置为Webkit内核特有的弹性盒模型（-webkit-box是旧版弹性盒语法，现代浏览器已支持标准display:flex，但这里为了兼容多行截断逻辑保留）。

目的是配合-webkit-box-orient和-webkit-line-clamp，让文本按照盒模型的垂直方向排列，为多行截断做基础布局准备。

2.-webkit-line-clamp:2:这个作用是限制元素内文本显示的最大行数，这里值为2表示最多显示2行文本，超出部分会被隐藏并替换为省略号。

3.-webkit-box-orient:vertical:作用是设置-webkit-box弹性盒模型的子元素（这里主要是文本行）排列方向为垂直方向，让文本能按行堆叠，这样-webkit-line-clamp才能准确计算并截断行数。

4.overflow:hidden;作用是隐藏超出元素容器范围的内容，因为前面限制了文本最多显示2行，超出的文本物理上还在容器内，通过overflow:hidden把超出部分裁剪掉，视觉上就看不到了。

5.text-overflow：ellipsis;作用当文本发生溢出时，在溢出内容的末尾显示省略号