【转】如何用css限制文字长度,使溢出的内容用省略号…显示-白红宇的个人博客

发布日期：2021-05-09 01:54:09 浏览次数：11 分类：博客文章

本文共 667 字，大约阅读时间需要 2 分钟。

文章转自(现在貌似被黑了，建议不要点击了)

ps：因在该地方没看到转载按钮，复制下存到这里以待自己方便，别人能看到帮助一下更是乐意之至，效果亲测可以实现，兼容IE、谷歌、火狐

由于文字内容长度的不确定,而网页的布局精确性,如果文字内容超出限定的区域(div,span等),会使页面变形.为了满足页面的布局合理,用css自动限制文字长度,使溢出内容用省略号…显示.

限制文字长的css样式如下:

.text_overflow{width:320px;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;overflow:hidden;}

此样式兼容ie,chrome,safari,opera,firefox6+版本,但是不兼容firefox低版本.

要想兼容低版本的firefox需要加入一个文件:ellipsis.xml,内容如下:

之后,css样式修改如下:

.text_overflow{width:320px;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;-moz-binding:url('ellipsis.xml#ellipsis'); overflow:hidden;}

上一篇：C#导出Excel文件Firefox中文件名乱码

下一篇：ajax请求报语法错误

发表评论

关于作者

喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！

-- 愿君每日到此一游！

发表评论

最新留言

关于作者

推荐文章