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 ...
随机推荐
- <?php function say() { echo 'hello world'; } //在这里调用函数 say(); php 调用方法say()
<?php function say() { echo 'hello world'; } //在这里调用函数 say(); php 调用方法say()
- MPI编程简介[转]
原文地址http://blog.csdn.net/qinggebuyao/article/details/8059300 3.1 MPI简介 多线程是一种便捷的模型,其中每个线程都可以访问其它线程的存 ...
- 设置 SSH 免密码登陆——仍提示输入密码
1)生成密钥:在根目录下(cd ~/ 用户根目录)执行如下语句: ssh-keygen -t dsa -P ' ' -f ~/.ssh/id_dsa 以上是两个单引号. 2)将id_dsa.pu ...
- JS的一些常见验证代码
1//檢查空串 2function isEmpty(str){ 3 if((str == null)||(str.length == 0)) return (true); 4 else retu ...
- WCF、Web API、WCF REST、Web Service的区别
Difference between WCF and Web API and WCF REST and Web Service The .Net framework has a number of ...
- 2016NEFU集训第n+3场 E - New Reform
Description Berland has n cities connected by m bidirectional roads. No road connects a city to itse ...
- Saltstack 操作目标,正则匹配,及组管理
如果我们要维护好一个庞大的配置管理系统那么首选得维护好我们的管理对象,在saltstack系统中我们的管理对象叫做Target, 在master上我们可以采用不同Target去管理不同的Minion. ...
- 安装cocoapods遇到的一些问题
其实可以直接到https://github.com/CocoaPods/Specs上把所需的文件夹下载下来 解压后命名为master放在本地的 ~/.cocoapods/repos 下面就行 但是使 ...
- 封装一个DivTag
封装一个DivTag,在页面加载的时候自动执行.用于创建任意的DOM节点,并且可以追加到任意的DOM节点上,可以设置样式,添加文本.var element = { __init__: function ...
- JavaScript 构造函数 prototype属性和_proto_和原型链 constructor属性 apply(),call()和bind() 关键字this
1.构造函数: 通常构造函数首字母需要大写,主要是为了区别ECMAScript的其它函数.(高程三 P145) 构造函数与其他函数的唯一区别,就在于调用它们的方式不同.只要通过new来调用,任何函数都 ...