css多行文本溢出省略号

在CSS中，可以使用text-overflow属性来实现多行文本溢出时显示省略号的效果。具体的代码如下所示：

HTML部分：

```html

```

CSS部分：

```css

.text-overflow {

width: 200px; /* 文本容器的宽度 */

height: 60px; /* 文本容器的高度 */

display: -webkit-box; /* 将容器设置为块状元素 */

-webkit-box-orient: vertical; /* 设置为垂直方向排列 */

overflow: hidden; /* 文本溢出时隐藏超出部分 */

text-overflow: ellipsis; /* 文本溢出时显示省略号 */

-webkit-line-clamp: 2; /* 最多显示2行文本 */

}

```

在上面的代码中，我们通过设置容器的宽度和高度，以及使用display属性将容器设置为块状元素，并将-webkit-box-orient属性设置为垂直方向排列。然后，通过设置overflow属性为hidden来隐藏文本溢出的部分，并使用text-overflow属性来显示省略号。*，使用-webkit-line-clamp属性来限制最多显示的行数。

请注意，这种方法只适用于Safari浏览器和基于WebKit内核的浏览器，如Chrome和Opera。对于其他浏览器，可以使用更复杂的方法，例如使用JavaScript来计算文本的高度，并在达到一定高度时显示省略号。