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多行文本溢出显示省略号(…)的更多相关文章

  1. css多行文本溢出显示省略号

    HTML: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <met ...

  2. css多行文本溢出显示省略号(兼容ie)

    在日常编写页面中,我们经常遇到内容行数过多时,需要出现 “...” 来处理.但是又要考虑IE浏览器或IE内核浏览器的兼容性. 普通实现方法: display: -webkit-box; -webkit ...

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

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

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

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

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

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

  6. CSS单行、多行文本溢出显示省略号(……)

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

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

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

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

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

  9. CSS单行、多行文本溢出显示省略号(……)解决方案

    单行文本溢出显示省略号(-) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 .ellipsis{ overflow: hidden; text-overf ...

随机推荐

  1. MATLAB等距扇形反投影分析

    MATLAB等距扇形反投影分析 摘要:MATLAB phantom函数产生的Shepp-Logan模型,可以用来验证二维图像重建算法的数值精确度,本文首先据此模型,结合正弦图,讨论平行投影时的极坐标表 ...

  2. NLP语言模型

    语言模型: I. 基本思想 区别于其他大多数检索模型从查询到文档(即给定用户查询,如何找出相关的文档), 语言模型由文档到查询,即为每个文档建立不同的语言模型,判断由文档生成用户查 询的可能性有多大, ...

  3. JavaScript document对象

    1.document对象是window对象的子对象,可直接使用,多用于获取HTML页面元素 2.document对象属性 a) alinkColor活动链接颜色 b) linkColor文本链接颜色 ...

  4. 走进MySQL

    MySQL 是最流行的关系型数据库管理系统,在 WEB 应用方面 MySQL 是最好的 RDBMS(Relational Database Management System:关系数据库管理系统)应用 ...

  5. JavaScript - 异步的前世今生

    ​ 在开始接触JavaScript的时候,书上有一句话我记忆深刻,JavaScript是一门单线程语言,不管从什么途径去获取这个消息,前端开发者都会记住,哦~~,JavaScript是一门单线程语言, ...

  6. Windows 聚焦(锁屏背景)不更新的解决方法

    在 Windows Store 搜索 Dynamic theme 安装后可对桌面背景.锁屏界面等进行设置,非常好用!

  7. python学习笔记:第13天 内置函数(一)

    详细文件查看点击这里:详细地址

  8. 在线升级python3.3版本

    1.sudo su 2.wget -P /usr/local  http://www.python.org/ftp/python/3.3.0/Python-3.3.0.tgz    #指定下载到目录/ ...

  9. STM32_2 简单分析startup函数

    ;******************** (C) COPYRIGHT STMicroelectronics ******************** ;* File Name : startup_s ...

  10. 关于 ssh 连接较慢的解决办法

    1. 概述 使用 ssh 软件连接 linux 时, 会碰到很慢的情况 2. 场景 概述 ssh 连接很慢 大概步骤 使用 xshell6 免费版, 连接 主机 一个小等待, 弹出 用户名 输入框 输 ...