假如这个div height为50px,width为160px,最多分三行
文字从服务器得到数据,如果超过第三行的长度在末尾加个...省略号。
问题是得到文本长度不固定,可能就几个字,不超一行。也有可能很多,超三行。
我知道有text-overflow:ellipsis这个属性,但我只想在超过的第三行末尾显示,
不是每一行末尾都显示
不知该怎么做?
CSS3 可以设置text-overflow:ellipsis
。
不用CSS3的话就只能添加js代码判断了
可以考虑在server端渲染模板时处理
用js实现:
function()
{
var maxwidth=15;
if($(this).text().length>maxwidth)
{
$(this).text($(this).text().substring(0,maxwidth));
$(this).text($(this).text()+'......');
}
}
maxwidth是设置的最大字符数
张大大对这个有研究:关于文字内容溢出用点点点(…)省略号表示