首页 > 给一个放多行文字的div,最后加一行文字末尾加省略号?

给一个放多行文字的div,最后加一行文字末尾加省略号?

假如这个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是设置的最大字符数

张大大对这个有研究:关于文字内容溢出用点点点(…)省略号表示

【热门文章】
【热门文章】