首先说css多行显示省略号和单行文本省略号:

我们知道,单行显示省略号时,我们首先需要设置容器的宽度width:value(具体的值),然后强制文本在一行内显示,即white-spacing:nowrap;再然后,溢出内容为隐藏,overflow:hidden;第四步:溢出文本显示省略号,即text-overflow:ellipsis;完成这四步即可实现单行文本省略号。

多行文本省略号:代码如下

display: -webkit-box;
-webkit-box-orient:vertical;
text-overflow: ellipsis;
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;//表明是2行文本显示省略号,换成3则表明是3行文本显示省略号
-webkit-box-orient: vertical;

css多行显示省略号的更多相关文章

  1. css 多行显示省略号....

    CSS属性如下: white-space: nowrap; overflow: hidden; text-overflow: ellipsis;

  2. css文字两行或者几行显示省略号

    做这个省略的问题,突然发现显示省略号是有中英文区分的 我做两行的时候用的是以下代码,在是中文的情况下是么得问题,到了英文下发现不起作用了 width: 250px; overflow: hidden; ...

  3. CSS文字过多显示省略号

    CSS文字过多显示省略号 /*-webkit-line-clamp用来限制在一个块元素显示的文本的行数*/ .dot1{ width: 100%; display: -webkit-box; -web ...

  4. css 超出部分显示省略号

    代码: overflow: hidden; white-space: nowrap;  text-overflow: ellipsis; 重点代码:text-overflow: ellipsis; 解 ...

  5. css--两行显示省略号兼容火狐浏览器

    css--两行显示省略号兼容火狐浏览器 正常写法: .ellipse1{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;} . ...

  6. CSS文本溢出显示省略号

    项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英雄指教. 单行 语法 ...

  7. css超出隐藏显示省略号怎么设置?

    当我们在进行网页前端开发的时候,一般获取文章标题,然后一行一行的显示.但是当标题过长的时候,就会造成换行显示.还有显示部分文本信息时,如果全部显示就过于繁琐,会带来不会的网页体验感.虽然我们可以使用o ...

  8. css 溢出文本显示省略号

    这个标题其实已经是一个老生常谈的问题了.很多时候,比如网站最基本的文章列表,标题会很长,而显示列表的区域宽度却没有这么宽,这时候最正常的做法就是 让超出宽度的部分文字用省略号(…)来表示.通常做法是网 ...

  9. Android中的TextView实现多行显示省略号

    今天遇到一个问题就是TextView显示内容的时候,多行显示的时候,显示省略号的问题,刚开始没有找到一个好的办法,只找到一个自定义TextView组件的方法,然而今天在贴吧中找到一个更好,更简便的方法 ...

随机推荐

  1. 面向对象Part3

    继承: Extends在英文中的翻译是拓展. 但是java允许多重继承. 一条线.单线. ------------------------------------------------------- ...

  2. Ajax跨域:jsonp还是CORS

    跨域一般用jsonp,兼容性比较好.CORS是html5最新的XHR第二版本,不支持IE8,IE9,对移动端的支持非常好.但是考虑项目后期这部分会转到同域名下,而且网址不需要支持ie8,ie9,所以我 ...

  3. MySql 里的IFNULL、NULLIF和ISNULL用法

    MySql 里的IFNULL.NULLIF和ISNULL用法 mysql中isnull,ifnull,nullif的用法如下: isnull(expr) 的用法: 如expr 为null,那么isnu ...

  4. iOS 系统数字键盘左下角加确定按钮

    首先在 viewWillAppear 方法中注册监听相应的键盘通知,并且要在 viewWillDisappear 方法中注销通知- (void)viewWillAppear:(BOOL)animate ...

  5. ArrayList、Vector、LinkedList源码

    List接口的一些列实现中,最常用最重要的就是这三个:ArrayList.Vector.LinkedList.这里我就基于JDK1.7来看一下源码. public class ArrayList< ...

  6. 配置ntp服务

    配置ntp服务(hadoop搭建可参考) 一:修改选定的服务器的本地时间 date -s '2016-10-07 16:29:30' +'%F %T' //需要设置的时间 二:修改后将时间写入到硬件时 ...

  7. 如何清除Xcode8打印的系统日志

    Xcode升级成8之后,就会发现控制台打印的日志莫名其妙的变得超级多,最关键的是很多都是没有用的东西,而有些有用的东西却淹没在那无任何卵用的里面,在这我就说一下如何关掉这些没有用的日志. 1.直接快捷 ...

  8. Android学习杂记

    Jni接口学习资料: http://www.cnblogs.com/lsnproj/archive/2012/01/09/2317519.html classLoader和插件化: http://bl ...

  9. C++ 系列:编译 boost

    Copyright © 1900-2016, NORYES, All Rights Reserved. http://www.cnblogs.com/noryes/ 欢迎转载,请保留此版权声明. -- ...

  10. HashMap两种遍历方式的深入研究

    转自:http://swiftlet.net/archives/1259 HashMap的遍历有两种方式,如下所示:第一种利用entrySet的方式:   1 2 3 4 5 6 7 Map map ...