div{

　　display: -webkit-box;

　　-webkit-box-orient: vertical;

　　word-break: break-all;

   word-wrap: break-word;

   white-space:pre-wrap;

　　text-overflow: ellipsis;

　　-webkit-line-clamp: 2;

　　overflow: hidden;

}

　　

如果只是一行的话，要简单一些。

white-space:nowrap;

overflow:hidden;

text-overflow:ellipsis;

css：实现文本两行或多行文本溢出显示省略号的更多相关文章

  1. css实现文本两行或多行文本溢出显示省略号

    word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/ -webkit-b ...

  2. css-文本两行或多行文本溢出显示省略号（转）

    转自:http://www.daqianduan.com/6179.html  感谢作者 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis ...

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

    一.单行文本省略 实现方法: overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 二.多行文本省略 实现方法: display ...

  4. CSS实现单行、多行文本溢出显示省略号（…）

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

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

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

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

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

  7. CSS单行、多行文本溢出显示省略号（……）

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

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

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

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

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

随机推荐

  1. Linux性能优化思路

    性能测试的核心,就是找出性能瓶颈并进行性能优化,解决"慢"的问题,最终满足客户业务需求. [性能需求来源及性能问题现象] 性能需求的来源,主要分为以下几类: 项目组提出性能需求: ...

  2. Java开发中的23种设计模式详解(收藏-转)

    设计模式(Design Patterns) ——可复用面向对象软件的基础 设计模式(Design pattern)是一套被反复使用.多数人知晓的.经过分类编目的.代码设计经验的总结.使用设计模式是为了 ...

  3. webpack入门进阶（1）

    1.webpack应用实例 1.1.快速上手 初始化项目 mkdir webpack-demo cd webpack-demo npm init -y 安装webpack npm i webpack@ ...

  4. 手把手教你把web应用丢到服务器上（单页应用+ 服务端渲染）

    前两篇文章中,我分别介绍了框架的搭建利用vue-cli + vant搭建一个移动端开发模板,并且把项目中axios请求和vuex的用法做了简要的介绍如何在项目里管理好axios请求与vuex.在这两篇 ...

  5. The meaningless Game

    题目 Slastyona and her loyal dog Pushok are playing a meaningless game that is indeed very interesting ...

  6. jQuery动态生成<select>下拉框

    前一阵在项目里需要动态生成下拉框,找了一下用jQuery实现比较方便,这里整理一下. 下文所述方法只是本人在项目中遇到问题的解决方法,场景较为简单,也希望能帮助有需要的朋友 1.动态生成下拉框的两种方 ...

  7. SQL Server 索引的含义和特点

    索引用于快速找出在某个列中某一特定值的行.不使索引,数据库必须从第一条记录开始读完整个表,直到找到相关行.如果表中查询的列有一个索引,数据库能快速到达一个位置去搜寻数据,而不必查看所有数据. 索引的含 ...

  8. 浅谈MySQL多表操作

    字段操作 create table tf1( id int primary key auto_increment, x int, y int ); # 修改 alter table tf1 modif ...

  9. IDEA中文注释难看的简单解决办法

    好多人会发现IDEA这款集成开发工具的中文(主要是在注释上面)显示都比较难看,如下面: 都以为是字体的原因,于是各种替换字体,麻烦不说,还容易造成乱码的问题. 真正难看的原因并不是字体,而是以为是斜体 ...

  10. idea2020.1.2破解，亲测可行，激活至2089年！

    一.下载最新版IDEA2020安装包 官网:https://www.jetbrains.com/idea/download/ 旧版:https://www.jetbrains.com/idea/dow ...