Html webkit线夹：限制不带省略号的线数

我试图限制文本区域中的行数。 我跟随这篇文章：

行得通，但我不想在课文结尾省略。用

剪辑

简单地替换

省略号

是行不通的。我如何改变它

下面是一个工作示例，a类和b类给出了相同的结果：

a组{
断字：断字；
溢出：隐藏；
文本溢出：剪辑；
显示：-网络工具包盒；
-webkit线夹：2个；
-网络工具包盒方向：垂直；
}
b组{
断字：断字；
溢出：隐藏；
文本溢出：省略号；
显示：-网络工具包盒；
-webkit线夹：2个；
-网络工具包盒方向：垂直；
}
文本溢出：剪辑：
你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！
文本溢出：省略号：
你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！你好，世界！

.class{
   word-break: break-word;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   line-height: 16px; /* fallback */
   max-height: 32px; /* fallback */
   -webkit-line-clamp: 2; /* number of lines to show */
   -webkit-box-orient: vertical;
}

<style> 
div.a {
    word-break: break-word;
    overflow: hidden;
    text-overflow: clip;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

div.b {
    word-break: break-word;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
</style>
    
<h2>text-overflow: clip:</h2>
<div class="a">Hello world! Hello world! Hello world!Hello world! Hello world! Hello world!Hello world! Hello world! Hello world!Hello world! Hello world! Hello world! Hello world! Hello world! Hello world!Hello world! Hello world! Hello world! Hello world! Hello world! Hello world!Hello world! Hello world! Hello world!</div>

<h2>text-overflow: ellipsis:</h2>
<div class="b">Hello world! Hello world! Hello world!Hello world! Hello world! Hello world!Hello world! Hello world! Hello world!Hello world! Hello world! Hello world! Hello world! Hello world! Hello world!Hello world! Hello world! Hello world! Hello world! Hello world! Hello world!Hello world! Hello world! Hello world!</div>