CSS3新增text-overflow: ellipse; 只支持单行文本

如果是多行文本， 在无法完全显示的情况下，可以按下面这样写：

overflow:hidden;

display: -webkit-box;

-webkit-line-clamp: 2;

-webkit-box-orient: vertical;

HTML5[6]：多行文本显示省略号的更多相关文章

  1. HTML5 元素文字超出部分显示省略号（支持多行），兼容几乎所有常用浏览器

    1,公共样式,在公共的 CSS 文件中加入以下内容  /* 超出部分显示省略号,支持多行 */ .text-ells:before { content: ''; float: left; width: ...

  2. css控制单行或者多行文本超出显示省略号

    1.单行文本 使用text-overflow:ellipsis属性 text-overflow: clip|ellipsis|string; clip:修剪文本. ellipsis:显示省略符号来代表 ...

  3. 11、多行文本最后一行显示省略号并截取文本字数（vue）

    1.首先通过css实现多行文本显示省略号: { height: 45px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-li ...

  4. css多行显示省略号

    首先说css多行显示省略号和单行文本省略号: 我们知道,单行显示省略号时,我们首先需要设置容器的宽度width:value(具体的值),然后强制文本在一行内显示,即white-spacing:nowr ...

  5. 单/多行文本添加省略号 (oﾟωﾟo)

    1.单行文本添加省略号 一般用于新闻列表展示 li{ width: 200px; height: 30px; line-height: 30px; cursor: pointer; list-styl ...

  6. div或者p标签单行和多行超出显示省略号

    单行文本溢出显示省略号 overflow: hidden;text-overflow:ellipsis;white-space: nowrap;多行文本显示省略号 display: -webkit-b ...

  7. css实现单行，多行文本溢出显示省略号……

    1.单行文本溢出显示省略号我们可以直接用text-overflow: ellipsis 实现方法: <style> .div_text{width: 300px; padding:10px ...

  8. 多行文本溢出显示省略号(…) text-overflow: ellipsis

    详解text-overflow 语法: text-overflow:clip | ellipsis 默认值:clip 适用于:块级容器元素 继承性:无 动画性:否 计算值:指定值 取值: clip:当 ...

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

    在项目中,由于实际描述文字过多,导致初始页面纵向长度过长,也使得余下信息利用率降低:所以在文字过多的时候,初始化限制行数是有必要的 1. CSS单行文本溢出,显示省略号 <div style=& ...

随机推荐

  1. iOS-触摸事件、手势识别、摇晃事件、耳机线控

    概览 iPhone的成功很大一部分得益于它多点触摸的强大功能,乔布斯让人们认识到手机其实是可以不用按键和手写笔直接操作的,这不愧为一项伟大的设计.今天我们就针对iOS的触摸事件(手势操作).运动事件. ...

  2. 利用jsoup爬虫工具，爬取数据，并利用excel导出

    import java.io.BufferedInputStream; import java.io.BufferedReader; import java.io.FileInputStream; i ...

  3. 已知2个一维数组：a[]={3,4,5,6,7}，b[]={1,2,3,4,5,6,7}；把数组a与数组b 对应的元素乘积再赋值给数组b，如：b[2]=a[2]*b[2]；最后输出数组b的元素。

    package hanqi; import java.util.Scanner; public class Test7 { public static void main(String[] args) ...

  4. 浅入“Block Formatting Context”

    本文主要是针对BFC特性的应用,至于什么是BFC,可以参看MDN的简介: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Block_fo ...

  5. 常用基础OC 集合

    //    2016年07月19日17:50:53    集合 //七.NSSet 集合对象(容器类,) //  1. 使用类方法创建对象 NSSet *set1 = [NSSet set];  // ...

  6. android: permission和uses-permission

    首先,先看一下permission定义的格式: <permission android:description="string resource" android:icon= ...

  7. SqlServer2008R2用Windows身份登录18456错误解决

    // 重装系统后发现SqlServer2008R2使用Windows身份验证不能进行连接,如下图: 以前经常会碰到SqlServer 身份验证连接失败,Windows身份验证的连接失败还是第一次,试了 ...

  8. spring4 security 4 +websocket 实现单点登录

    测试地址:http://sms.reyo.cn/ 帐号:aa 密码:123456 先看一下效果图: spring4 security 4 实现单点登录,而websocket 实现单点的下线通知

  9. 构造函数模式自己定义js对象

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

  10. webService发布和调用--Axis2

    一.工具 1.下载 Axis2以及eclipse的Axis2插件.http://axis.apache.org/axis2/java/core/download.cgi 2.axis2-1.7.1-w ...