css文本超出2行显示...

可以使用CSS的text-overflow和ellipsis属性来实现文本超过2行时显示省略号。

设置文本溢出隐藏

使用CSS的overflow属性来将文本溢出部分隐藏，同时使用white-space属性来设置文本换行方式为normal或者nowrap。

.overflow {
  overflow: hidden;
  white-space: normal;
  /* 或者 white-space: nowrap; */
}

1. 设置文本超过2行显示省略号

使用CSS的text-overflow属性来设置文本超过2行后显示省略号。同时，需要设置宽度和高度来控制文本显示的区域。

.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  /* 设置宽度和高度 */
  width: 200px;
  height: 40px;
}

上述代码中，-webkit-line-clamp属性设置为2表示最多显示2行文本，-webkit-box-orient属性设置为vertical表示文本垂直排列。注意这里使用了CSS3的属性，需要在不同浏览器中加上不同的前缀。

示例代码如下：

<div class="ellipsis">
  This is a long text that needs to be truncated after two lines in order to improve the design.
</div>

.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  width: 200px;
  height: 40px;
}