网页制作 
首页 > 网页制作 > 浏览文章

CSS 超出隐藏实现限制字数的功能代码(多浏览器)

(编辑:jimmy 日期: 2024/11/3 浏览:3 次 )
CSS限制字数

复制代码代码如下:
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis; /* for IE */
-o-text-overflow: ellipsis; /* for Opera */
-icab-text-overflow: ellipsis; /* for iCab */
-khtml-text-overflow: ellipsis; /* for Konqueror Safari */
-moz-text-overflow: ellipsis; /* for Firefox,mozilla */
-webkit-text-overflow: ellipsis; /* for Safari,Swift*/


看了 上面的代码挺郁闷的,根本实现不了,看来好多站长对这种简单的代码都不测试就发了,郁闷。所以我们特别发一下我们自己用的,但firefox不兼容但可以使用,没有省略号。

提示:您可以先修改部分代码再运行
下面是用js实现的通过计算数字的长度进行截取的,但对于中文跟英文一样算一个,是肯定不行的了,以前发布过js计算字符串长度的,中文算两个字符的文章,可以参考下。

提示:您可以先修改部分代码再运行
这个是css after实现的

提示:您可以先修改部分代码再运行

参考文章:
https://www.jb51.net/article/15239.htm 
https://www.jb51.net/article/14210.htm
上一篇:Div+CSS 布局入门教程之二 构建网站
下一篇:css的核心内容 标准流、盒子模型、浮动、定位等分析
一句话新闻
Windows上运行安卓你用过了吗
在去年的5月23日,借助Intel Bridge Technology以及Intel Celadon两项技术的驱动,Intel为PC用户带来了Android On Windows(AOW)平台,并携手国内软件公司腾讯共同推出了腾讯应用宝电脑版,将Windows与安卓两大生态进行了融合,PC的使用体验随即被带入到了一个全新的阶段。
友情链接:杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网 SiteMap