有时候文字太多，但为了美观想要在第二行的时候才显示省略号，而不是第一行超出马上就出现省略号

下面是css代码：

overflow:hidden;
text-overflow: ellipsis;//显示省略号
display:-webkit-box;
-webkit-line-clamp:2;//块元素显示的文本行数
-webkit-box-orient:vertical;

截图：

定义在div上就可以了

上效果图

这样文字不会到第三行

html div内第二行文字显示不下的时候才用省略号代替 css实现的更多相关文章

  1. Cell 动态行高文字显示不全问题探索

    目录 问题概述 一.新建工程 二.尝试复现问题 尝试解决 修改contentLblBtmCon优先级为High(750) 修改contentLblBtmCon优先级为Low(250) 小结 其他解决思 ...

  2. CSS——div内文字的溢出部分用省略号显示

    使得div内文字的溢出部分用省略号显示,可归纳为两种解决办法,一种方法是用CSS解决,另一种方法是js解决. 一.通过CSS控制显示 div内显示一行,超出部分用省略号显示 div内显示多行,超出部分 ...

  3. CSS div内文字显示两行，超出部分省略号显示

    1. 概述 1.1 说明 在项目过程中,有时候需要控制div内文字最多显示两行,超出的使用省略号进行处理.使用识别码/前缀-webkit进行处理可直接得到相应效果. 1.1 -webkit WebKi ...

  4. div内文字显示两行，多出的文字用省略号显示

    用-webkit-私有属性,代码如下:text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;disp ...

  5. ios UILabel在storyBoard或xib中如何在每行文字不显示完就换行

    大家知道怎么用代码让label中的文字换行,只需要 label.numberOfLines = 0; label.text = @"这是第一行啦啦啦啦,\n这是第二行啦啦,\n这是第三行&q ...

  6. div+css使多行文字垂直居中?

    1.单行文字: 设置height = line-height; 多行文字: 设置 padding, 自己要计算一下? vertical-align: 可以设置垂直居中, 但是只是针对本身就具有 ali ...

  7. line-height系列（二）——对行内元素（文字、图片、兄弟元素）、块级元素设置line-height后的表现

    >原创文章,转载请注明来源! 二.对行内元素(文字.图片.兄弟元素).块级元素设置line-height后的表现 对块级元素无效,对行内元素有效.可继承给行内元素. 文字的line-height ...

  8. 完美解决 向UILable 文字最后插入N张图片,支持向限制行数的UILable 最后一行插入,多余文字显示...

    效果: ====直接上代码吧=== // // UILabel+StringFrame.h // QYER // // Created by qyer on 15/3/19. // Copyright ...

  9. 如何通过css控制内容显示顺序 第二行的内容优先显示

    我们有时进行网页设计时为了想让用户感兴趣的内容优先显示在前,又不想改动代码的先后顺序,要怎么操作呢?(或者换种说法:源代码中要先看到A再看到B,而视觉上是先B再A)举个简单的例子,想让第二行的内容在不 ...

随机推荐

  1. [19/03/30-星期六] IO技术_四大抽象类_ 字节流( 字节输入流 InputStream 、字符输出流 OutputStream )_(含字节文件缓冲流)

    一.概念及分类 InputStream(输入流)/OutputStream(输出流)是所有字节输入输出流的父类 [注]输入流和输出流的是按程序运行所在的内存的角度划分的 字节流操作的数据单元是8的字节 ...

  2. XXE攻防——XML外部实体注入

    XXE攻防——XML外部实体注入 转自腾讯安全应急响应中心 一.XML基础知识 XML用于标记电子文件使其具有结构性的标记语言,可以用来标记数据.定义数据类型,是一种允许用户对自己的标记语言进行定义的 ...

  3. ASP.NET Web API编程——异常捕获

    1 向客户端发送错误消息 使用throw new HttpResponseException()向客户端抛出错误信息. HttpResponseException包含两个重载的构造函数,其中一个是构造 ...

  4. 关于webstorm打开项目，文件下方出现了一个小锁的图标，修改文件出现“cannot modify a ready-only directory”的弹窗提示

    今天用webstorm打开项目,文件下方出现了一个小锁的图标,修改文件出现“cannot modify a ready-only directory”的弹窗提示 解决办法:运行 sudo chown ...

  5. 设计模式——Spirng_Bean工厂

    前言:对于简单工厂和抽象工厂都有自己的优点和缺点, 比如简单工厂,如果你需要实现的类过多,你最后会出现工厂泛滥的情况,没有有效的控制代码的可重复性.http://www.cnblogs.com/xia ...

  6. HDU 1029 Ignatius and the Princess IV （map的使用）

    传送门: http://acm.hdu.edu.cn/showproblem.php?pid=1029 Ignatius and the Princess IV Time Limit: 2000/10 ...

  7. UITableViewCell在重用ID时为何加上Static关键字

    UITableViewCell在重用ID时为何加上Static关键字 先回顾一下iOS各种变量作用域和生命周期相关知识: 1.方法中临时变量存储在栈区,出了该方法,临时变量会被自动销毁.但是如果给方法 ...

  8. LeetCode28.实现strStr() JavaScript

    实现 strStr() 函数. 给定一个 haystack 字符串和一个 needle 字符串,在 haystack 字符串中找出 needle 字符串出现的第一个位置 (从0开始).如果不存在,则返 ...

  9. EDA风格与Reactor模式

    本文将探讨如下几个问题: Event-Driven架构风格的约束 EDA风格对架构属性的影响 Reactor架构模式 Reactor所解决的问题 redis中的EventDriven 从观察者模式到E ...

  10. Oracle中按规定的字符截取字符串

    CREATE OR REPLACE FUNCTION "F_SPLIT" (p_str IN CLOB, p_delimiter IN VARCHAR2) RETURN ty_st ...