word-break: break-all;

text-overflow: ellipsis;

display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/

-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/

-webkit-line-clamp: 3; /** 显示的行数 **/

overflow: hidden;  /** 隐藏超出的内容 **/

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

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

    div{ display: -webkit-box; -webkit-box-orient: vertical; word-break: break-all; word-wrap: break-wor ...

  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下如何删除十字符libudev.so病毒文件

    服务器不停的向外发包,且CPU持续100%,远程登录后查看发现有一长度为10的随机字符串进程,kill掉,会重新生成另外长度为10的字符串进程.删除文件也会重复生成,非常痛苦.查阅crond相关日志, ...

  2. MVC 模型 视图， 控制器 写 三级联动

    <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...

  3. 从dfs向动态规划过渡

    据说每一个dfs,都能用动态规划思想做出来. 首先要明白dfs与动态规划的一些小要点   1)dfs重在通过使用递归来使用不同的选择,通过使用形参的改变实现不同情景的改变(形参既包括了代价,又包含了结 ...

  4. 【maven】在idea上创建maven多模块项目

    参考:https://www.cnblogs.com/wangmingshun/p/6383576.html 一:创建父项目 (1)idea引导页 (2)创建父项目,不需要选择maven插件 (3)完 ...

  5. 剑指offer-特定二维数组中查找一个元素是否存在-二分搜索-二维数组

    int [][] array ={ {1,2,8,9}, {2,4,9,12}, {4,7,10,13}, {6,8,11,19} }; 在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都 ...

  6. apache flink kubernetes 运行试用

    类似docker-compose 运行模式,使用的是deploy 的模式 deploy yaml 文件 deploy-k8s-yaml apiVersion: extensions/v1beta1 k ...

  7. JS替换空格回车换行符

    JS替换空格回车换行符 str=str.replace(/\r/g," ") str=str.replace(/\n/g,"<br />")  或 ...

  8. Windows 10 子系统 Ubuntu 中安装 FastAdmin

    Windows 10 子系统 Ubuntu 中安装 FastAdmin 打开 Windows 10 子系统 安装 Ubuntu 修改安装源为阿里的 %LOCALAPPDATA%\Packages\Ca ...

  9. 【Bitmap Index】B-Tree索引与Bitmap位图索引的锁代价比较研究

    通过以下实验,来验证Bitmap位图索引较之普通的B-Tree索引锁的“高昂代价”.位图索引会带来“位图段级锁”,实际使用过程一定要充分了解不同索引带来的锁代价情况. 1.为比较区别,创建两种索引类型 ...

  10. Spring 集成开发工具（STS）安装及配置

    安装 spring 集成开发工具,下载地址:https://spring.io/tools 下载后,解压,双击 STS ,运行. 如果提示: 去oracle的网站上下载了1.8版本的jdk,下载地址如 ...