-webkit-line-clamp 显示放大或缩小时部分切断的最后一行



我正在使用-webkit-line-clamp属性来实现Chrome上的多行省略号。我们适当地设置了高度和最大高度,以便我们准确地看到 N 条线和正确的省略号。但是,一旦我们在浏览器中放大或缩小,就会显示部分切断(N + 1(的第行。有没有办法防止无论缩放级别如何都显示此部分切断的线?

CSS 是:

myText {
  font-size: 12px;
  line-height: 14px;
  width:200px;
  height:58px;
  max-height:58px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

和 HTML 是

<div class="myText">imagineSomeLongTextHere</div>

如果它对某人有帮助 - 我添加了以下 CSS 来解决此问题:

-webkit-box-pack: end;

最新更新