文本超出显示三个点一般分两种情况

　　一,单行文本超出隐藏

　　　overflow:hidden;

　　　text-overflow:ellipsis;

　　　white-space:nowrap;

　　二,多行文本超出隐藏

　　　　text-overflow: -o-ellipsis-lastline;

　　　　overflow: hidden;

　　　　text-overflow: ellipsis;

　　　　display: -webkit-box;

　　　　-webkit-line-clamp: 3; //行数需设置

　　　　line-clamp: 3;

　　　　-webkit-box-orient: vertical;

单行设置宽 多行设置宽高不然不会生效

css文本超出隐藏 显示三个点的更多相关文章

  1. CSS——文本超出隐藏显示省略号

    文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...

  2. css文本超出隐藏显示省略号

    p style="width: 300px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"> 如 ...

  3. CSS实现不换行/自动换行/文本超出隐藏显示省略号

    在写页面的时候,我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧! 1.自动换行 div{ word-wrap:break-word; word ...

  4. css文本溢出隐藏显示省略号（单行+多行）

    文本超出若干行就换行,这个功能几乎每个文本浏览网站都会用到,实现它的办法也有很多,今天简单的介绍一下实现它的方法.  一. 单行文本不换行,并将超出文本隐藏 .box-content{     ove ...

  5. css 文本超出范围显示省略号

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. css不受高度限制实现文本超出隐藏并以省略号结束

    文本超出省略号显示代码: overflow: hidden; text-overflow:ellipsis; white-space: nowrap;width: 100px; /*宽度做好限制*/ ...

  7. css文本超出省略号

    终于完成了项目了,今天我就分享自己在项目中比较实用的一些功能的实现,第一个就是纯css文本超出省略号 /* 文本单行超出省略号 */ .textels { overflow: hidden; text ...

  8. css文字超出自动显示省略号

    只针对单行文本有效: 01.针对块状元素 ul li{ width: 180px; text-overflow: ellipsis; white-space: nowrap;/*禁止自动换行*/ ov ...

  9. CSS 文本溢出时显示省略标记

    如标题所示... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.o ...

随机推荐

  1. [go]template使用

    //index.html {{if gt .Age 18}} <p>hello, old man, {{.Name}}</p> {{else}} <p>hello, ...

  2. 微信自定义分享 IOS端分享失败

    1.在IOS微信浏览器中自定义分享link 链接中的中文需要encodeURIComponent() 编码(安卓会自动编码) 2.另外在IOS微信浏览器中自定义分享 imgUrl  不能大于34KB ...

  3. 003-多线程-JUC线程池-几种特殊的ThreadPoolExecutor【newFixedThreadPool、newCachedThreadPool、newSingleThreadExecutor、newScheduledThreadPool】

    一.概述 在java doc中,并不提倡我们直接使用ThreadPoolExecutor,而是使用Executors类中提供的几个静态方法来创建线程池: 以下方法是Executors下的静态方法,Ex ...

  4. Linux命令之ntpdate、hwclock

    ntpdate用于同步系统时间.hwclock用于同步硬件时间. (1).ntpdate ntpdate [选项] [时间服务器] 一般直接ntpdate [时间服务器] 常用的时间服务器:ntp[1 ...

  5. centos安装tidy扩展

    wget http://pecl.php.net/get/tidy-1.2.tgztar -xvzf tidy-1.2.tgzcd tidy-1.2/usr/local/php/bin/phpize. ...

  6. 用alert打印js对象

    用alert查看对象: function writeObj(obj){ var description = ""; for(var i in obj){ var property= ...

  7. IOS上的 Audio Memos SE 如何分享和传输录音到电脑？

    Audio Memos SE 是 Audio Memos 的精简版 ,顾名思义就是少了很多实用功能.当初下载这个就是因为广告比较少一些,没有全屏幕的广告. 好了,录了音,想分享和传到电脑要怎么弄呢? ...

  8. Jmeter 逻辑控制器 之 While Controller

    一.认识 While Controller 如下图,创建一个While Controller (While 循环控制器) 设置界面如下: Condition (function or variable ...

  9. 准备openstack基础环境

    在所有的openstack节点上执行 1.配置阿里yum源 yum -y install wget rm -rf /etc/yum.repos.d/* wget -O /etc/yum.repos.d ...

  10. thymeleaf如何遍历数据 each循环的使用

    首先在html开始标签中引入一个属性 xmlns:th="http://www.thymeleaf.org" 遍历数据示例 <tbody> <tr th:each ...