css - 遵循 css 的设计在 Mozilla firefox 中未按预期出现

Question

我有一个 CSS，如下所示。

.controlledline4 {
   display: -webkit-box;
  overflow : hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;  
}

但是上面CSS的设计在Chrome中显示完美，但在Mozilla Firefox中显示不清晰。注意:上面的代码是为了隐藏冗长的文本，只显示文本开头的几行。

Answer 1

Mozilla 使用 -moz CSS 属性。Chrome 和 Safari 使用 -webkit。 IE9+ 使用 -ms。

修改你的 CSS 如下:

.controlledline4 {
   display: -webkit-box;
  overflow : hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  -moz-line-clamp: 3;
  -webkit-box-orient: vertical;  
  -moz-box-orient: vertical;  
}

这应该有效。