截取字符串并补充省略号的两种方法

css方式(建议使用)
用css方式来实现截取字符串并补充省略号:


css代码图

那么我们来了解一下这几个css属性,为何能实现这种效果:

1. white-space
如何处理元素内的空白

white-space-可能的值

2. word-break
自动换行的处理方法

word-break-语法

3. overflow
当内容溢出元素框时发生的事情

overflow-可能的值

4.text-overflow(本次功能实现的最重要部分)
当文本溢出包含元素时发生的事情

text-overflow-语法


js方式

这种方式应用较少,直接上代码:

js代码图

版权印为您的作品印上版权47110210

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,843评论 1 92
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    前端进阶之旅阅读 16,654评论 32 459
  • 不知不觉 已经12月了,明天开始好好学习!好好生活!记得吃水果(•‿•)
    哒啦咘啦啦阅读 176评论 0 0
  • 人云:"水为财"。钱的价值无物可比。有钱能使鬼推磨, 诱惑世人贪婪去攫取。"人为财死, 鸟为食亡。” 而且“...
    王卓族阅读 1,155评论 0 1
  • 当所有人都在说,你的孩子不好时,你会怎么做?而且说他不好的,都是你信任的亲朋好友。 一个孩子,刚毕业两三年,每年换...
    田螺姑娘FZ阅读 248评论 0 0