css多行文本溢出显示省略号(…)
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多行文本溢出显示省略号(…)的更多相关文章
- css多行文本溢出显示省略号
HTML: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <met ...
- css多行文本溢出显示省略号(兼容ie)
在日常编写页面中,我们经常遇到内容行数过多时,需要出现 “...” 来处理.但是又要考虑IE浏览器或IE内核浏览器的兼容性. 普通实现方法: display: -webkit-box; -webkit ...
- CSS实现单行、多行文本溢出显示省略号(…)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- CSS和JS实现单行、多行文本溢出显示省略号(该js方法有问题不对)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- CSS单行、多行文本溢出显示省略号(……)
这个问题经常遇到 1.单行文本溢出显示省略号(…) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 overflow:hidden;text-overflo ...
- css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- CSS单行、多行文本溢出显示省略号
如果实现单行文本的溢出显示省略号小伙伴们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; t ...
- CSS单行、多行文本溢出显示省略号(……)解决方案
单行文本溢出显示省略号(-) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 .ellipsis{ overflow: hidden; text-overf ...
随机推荐
- CSS权重的比较方法
CSS的权重如下: !important Infinity正无穷 行间样式 1000 id 100 class|属性|唯类 10 标签|伪元素 1 通配符 0 256进制 当出现多个 ...
- vue 方法相互调用注意事项与详解
vue在同一个组件内: methods中的一个方法调用methods中的另外一个方法: 可以直接这样调用:this.$options.methods.test(); this.$options.met ...
- iOS之在AppDelegate中push到指定页面
UITabBarController *tbc = (UITabBarController *)self.window.rootViewController; UINavigationControll ...
- 几行代码实现iOS摇一摇功能
实现这个功能很简单,我们直接看代码 - (void)motionBegan:(UIEventSubtype)motion withEvent:(UIEvent *)event{ NSLog(@&quo ...
- 不用注解,获取spring容器里的bean(ApplicaitonContext)
以静态变量保存Spring ApplicationContext, 可在任何代码任何地方任何时候取出ApplicaitonContext. 使用方法:SpringContextHolder.getBe ...
- zabbix 3.x 监控日志文件
1.启用zabbix主动模式 在zabbix agent端,修改/etc/zabbix/zabbix_agentd.conf ServerActive=服务端IP Hostname=tspnginx0 ...
- 将图片绘制到画布上:imagecopy()
<?php //1. 绘制图像资源(创建一个画布) $image = imagecreatetruecolor(500, 300); //2. 先分配一个绿色 $green = imagecol ...
- TCC : Tiny C Compiler (2018-2-6)
饭墙下载,有缘上传: https://files.cnblogs.com/files/bhfdz/tcc-0.9.27-win32-bin.zip https://files.cnblogs.com/ ...
- Java软件开发者,如何学习大数据?
正常来讲学习大数据之前都要做到以下几点 1.学习基础的编程语言(java,python) 2.掌握入门编程基础(linux操作,数据库操作.git操作) 3.学习大数据里面的各种框架(hadoop.h ...
- 剑指offer题目系列三(链表相关题目)
本篇延续上一篇剑指offer题目系列二,介绍<剑指offer>第二版中的四个题目:O(1)时间内删除链表结点.链表中倒数第k个结点.反转链表.合并两个排序的链表.同样,这些题目并非严格按照 ...