我有一个小问题。我找到了一种使用跨浏览器多行省略号的方法。
这是我的 less CSS mixin。
正如您所看到的,这个版本在webkit中运行完美,在所有其他浏览器中运行“ok”。
.ellipsis-multi(@lh, @l, @mw) {
/* non-webkit */
max-height: @lh*@l;
/* webkit */
-webkit-box-orient: vertical;
-webkit-line-clamp: @l;
display: -webkit-box;
line-height: @lh;
max-width: @mw;
overflow: hidden;
text-overflow: ellipsis;
}
.excerpt {
&.hide {
.ellipsis-multi(1.4em, 3, 100%)
}
}
Run Code Online (Sandbox Code Playgroud)
我的问题是,我使用阅读更多链接来添加和删除“隐藏”类。这很完美,但如果摘录 div 只有 2 行文本,链接也可见。
如果需要省略号,我需要一种仅显示链接的方法。
这是一个 Codepen 示例 http://codepen.io/janwagner/pen/ubHef
我更喜欢仅 CSS 的方法来解决这个问题:)