text-overflow:ellipsis属性可以实现单行文本的溢出显示省略号(…)。但部分浏览器还需要加宽度width属性。

css代码:

overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

但是这个属性并不支持多行文本溢出显示省略号,这里根据应用场景介绍几个方法来实现这样的效果。

WebKit浏览器或移动端的页面

overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;

css多行文本溢出显示省略号(…)的更多相关文章

  1. css多行文本溢出显示省略号

    HTML: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <met ...

  2. css多行文本溢出显示省略号(兼容ie)

    在日常编写页面中,我们经常遇到内容行数过多时,需要出现 “...” 来处理.但是又要考虑IE浏览器或IE内核浏览器的兼容性. 普通实现方法: display: -webkit-box; -webkit ...

  3. CSS实现单行、多行文本溢出显示省略号(…)

    如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...

  4. CSS和JS实现单行、多行文本溢出显示省略号(该js方法有问题不对)

    如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...

  5. 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略

    省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...

  6. CSS单行、多行文本溢出显示省略号(……)

    这个问题经常遇到 1.单行文本溢出显示省略号(…) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 overflow:hidden;text-overflo ...

  7. css实现多行文本溢出显示省略号(…)全攻略

    省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...

  8. CSS单行、多行文本溢出显示省略号

    如果实现单行文本的溢出显示省略号小伙伴们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; t ...

  9. CSS单行、多行文本溢出显示省略号(……)解决方案

    单行文本溢出显示省略号(-) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 .ellipsis{ overflow: hidden; text-overf ...

随机推荐

  1. Etherlab debian安装记录

    debian wheezy 7.11(虚拟机安装选择桥接网卡) #set ustc source #apt-get install sudo #nano /etc/sudoers;add userNa ...

  2. oracle 之分析函数 over (partition by ...order by ...)

    一:分析函数overOracle从8.1.6开始提供分析函数,分析函数用于计算基于组的某种聚合值,它和聚合函数的不同之处是对于每个组返回多行,而聚合函数对于每个组只返回一行. 1.分析函数和聚合函数的 ...

  3. CYQ MAction,子表 新增,删除,修改 集合

    using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...

  4. 关于Vue的组件的通用性问题

    在项目中,经常会有需求让我们把很多通用性的功能写成一个模板,然后根据不同的应用场景传入不同的参数来完成某种功能 但是在很多时候,其实并不是一个模板就能完成所有的功能的 这就需要分类写组件了,但是需求方 ...

  5. php.ini修改后,重启无效

    今天做项目,上传图,需要修改php.ini.发现修改后,多次长期服务器也没用,在网上找了好多方案.介绍一下我的流程 1.使用phpinfo()找到php.ini的位置,如果位置不准确,修改肯定没有任何 ...

  6. day 26 网络知识 01

    一.    c/s 架构: 客户端(client)/服务端(server)架构       服务端: 提供服务的      客户端: 享受服务的     B/S 架构:浏览器(browser)/服务端 ...

  7. Python学习手册之正则表达式和元字符

    在上一篇文章中,我们介绍了 Python 的数据封装.类方法.静态方法和属性函数,现在我们介绍 Python 的正则表达式和元字符.查看上一篇文章请点击:https://www.cnblogs.com ...

  8. 树莓派编译程序时报错:virtual memory exhausted: Cannot allocate memory

    一.原因分析: 树莓派内存太小,编译程序会出现virtual memory exhausted: Cannot allocate memory的问题,可以用swap扩展内存的方法. 二.解决方法: 安 ...

  9. 牛客小白赛4J——强迫症

    链接:https://www.nowcoder.com/acm/contest/134/J 来源:牛客网 思路:把数列排序,把每一个重复的元素和最后一个数想加得到新数,在删掉这一元素即为去重的最少步骤 ...

  10. 回顾爬虫的时候的一些小TIPS

    1 json.dumps的时候默认会用ascii 所以在写入文件的时候会需要用到的指令变为json.dumps(a,ensuer_ascii=False),这样将禁止转换为ascii 然后再写入的时候 ...