css设置文字两行 超出省略号

可以使用CSS的text-overflow属性来实现文字两行超出省略号的效果。具体代码如下：

<style>
    .text {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
    }
</style>

<div class="text">
    这是一段文字，如果超出两行就会显示省略号。
</div>

解释一下上面代码中的几个属性：

• display: -webkit-box; 将元素设置为弹性盒子，可以方便地控制元素的布局。
• -webkit-box-orient: vertical; 将弹性盒子的方向设置为垂直方向，使得文字可以竖直排列。
• -webkit-line-clamp: 2; 设置弹性盒子的行数为2行。
• overflow: hidden; 隐藏超出弹性盒子的内容。
• text-overflow: ellipsis; 当文本溢出容器时，用省略号表示溢出的文本。

通过上述代码，就可以实现文字两行超出省略号的效果了。