CSS单行、多行文本溢出显示省略号(……)
这个问题经常遇到
1、单行文本溢出显示省略号(…)
text-overflow:ellipsis-----部分浏览器还需要加宽度width属性
overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
2、多行文本溢出显示省略号,WebKit浏览器或移动端的页面
overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
3、兼容各种浏览器的jQuery插件-jQuery.dotdotdot(https://github.com/FrDH/jQuery.dotdotdot)
这个用起来很简单,js加
$(function(){
$("#div1").dotdotdot({});
})
css里设置宽高,宽控制换行,高控制显示几行。
CSS单行、多行文本溢出显示省略号(……)的更多相关文章
- CSS 单行 多行文本溢出显示省略号
单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行文本溢出显示省略号: <style type=&quo ...
- 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- css实现多行文本溢出显示省略号(…)
WebKit浏览器或移动端的页面在WebKit浏览器或移动端(绝大部分是WebKit内核的浏览器)的页面实现比较简单,可以直接使用WebKit的CSS扩展属性(WebKit是私有属性)-webkit- ...
- CSS实现单行、多行文本溢出显示省略号(…)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- CSS和JS实现单行、多行文本溢出显示省略号(该js方法有问题不对)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- CSS单行、多行文本溢出显示省略号
如果实现单行文本的溢出显示省略号小伙伴们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; t ...
- CSS单行、多行文本溢出显示省略号(……)解决方案
单行文本溢出显示省略号(-) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 .ellipsis{ overflow: hidden; text-overf ...
- 《CSS实现单行、多行文本溢出显示省略号》
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方式: overflow: hidden; te ...
随机推荐
- css布局理解
1.盒模型(页面的所有元素都看成一个类似于礼品盒的盒子:包括块级元素和行内元素(也叫内联元素)):http://www.cnblogs.com/cchyao/archive/2010/07/12/17 ...
- struts2防止重复提交的标签
struts2 token 使用说明 --------------------------------------------------------------------------------- ...
- java 读取excel(Map结构)xls
package com.sun.test; import java.io.FileInputStream;import java.io.FileNotFoundException;import jav ...
- reshape2 数据操作 数据融合( cast)
我们在做数据分析的时候,对数据进行操作也是一项极其重要的内容,这里我们同样介绍强大包reshape2,其中的几个函数,对数据进行操作cast和melt两个函数绝对少不了. 首先是cast,把长型数据转 ...
- 安卓---下拉刷新---上拉加载---解决导入library等自生成库文件失败的问题
本文的下拉刷新以及上拉加载都是用PullToRefresh实现的,关于PullToRefresh的介绍以及源码,网上可以找到很多,本人在此不再赘述. PullToRefresh是一套实现非常好的下拉刷 ...
- Spring入门学习(二)三种实例化bean的方法
前面的哪一种就是通过构造函数来实例化对象 下面我们可能用到工厂方法来视力话对象,这样我们的配置文件又该怎么配置呢 <bean name="service2" class=&q ...
- delphi 中sql的语法规范
1.引号配对: 这是在Delphi使用SQL语句时容易出错的地方,由于delphi规定在字符串中用两个西文的单引号“''”表示一个“'”,在拼装语句的时候就容易疏忽遗漏. Delphi里有个函数Q ...
- [转载]The Island Castaway mac版解锁
http://blog.sina.com.cn/s/blog_506b3ac90101ke0e.html 1.首先,去安装一个The Island - Castaway™ mac free版,然后打开 ...
- C# html转mht
项目中引入cdosys.dll组件,位置: C:\Windows\System32\cdosys.dll CDO.ADODB 这些类都来自于cdosys.dll组件 /// <summary& ...
- User already has more than 'max_user_connections' active connections
vi /etc/my.cnf修改 max_user_connections 参数的数值,重启 MySQL 服务器