在单行文本的情况下,可以用来使超出范围的文本用省略号隐藏:
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
但是当遇到多行的文本,固定了高度的情况下,这又该如何写呢?
像下面这个文本一样,结尾是 "..."
Over the past day or so the vituperation |
---|
against the iOS 6 Maps app, AKA the Maps |
app that makes you wish you were ... |
Webkit支持一个名为-webkit-line-clamp的属性,他其实是一个WebKit-Specific Unsupported Property
p {
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
p {
overflow: hidden;
white-space: normal;
height: 3em;
text-overflow: -o-ellipsis-lastline;
}
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。