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 ...
随机推荐
- ajax格式,需要指定交互的data类型
思路 先打印所有返回值 console.log(d); {''status'':999} 再查看返回值,能否转换为json dataType:'json', //大小写敏感. datatype ...
- vs2012常用快捷键总结
ctrl+k+c 注释 ctrl+k+u 取消注释 ctrl+m+t 折叠代码 ctrl+t 取消折叠 ctrl+k+d 调节代码 ctrl+f 查找 ctrl+g 跳转行(一般调试的时候显示哪行 ...
- Chapter 14_5 _ENV和load
load在加载代码块时,通常使用全局环境去初始化代码块的_ENV上值. 然而,load选项的第四个参数给出的值就是供_ENV用的.(loadfile函数参数也是一样) 举一个有关初始化的例子,假如我们 ...
- tomcat源码分析(一)
tomcat的启动从Bootstrap类的main方法开始. public static void main(String args[]) { //单例 if (daemon == null) { d ...
- SharePoint 2013 InfoPath 无法保存下列表单
转载自:http://www.cnblogs.com/jianyus/p/3470121.html 在使用InfoPath发布表单,发布到SharePoint服务器报错,如下介绍: 环境:Window ...
- js事件冒泡和捕捉
(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发. IE 5.5: div -> body -> document IE 6.0: div ...
- SVG中image tag的高亮
今天下午和晚上全部在实验室调试scs可视化,下午主要时间在调试字符云图的东西,不过感觉没有提升,还是不好看,囧~~ 把力道图中的线条给调整了,调细之后,好看了不少. 因为需要多个区域交互,也就是需要高 ...
- wordpress建站过程2——结构
开始wordpress之前,我们需要了解,wordpress的结构和调用方式. 当一个wordpress开始之后,他会读取[当前主题]的index.php.所以一旦主题切换了,它读的就是其他主题的in ...
- 错误记录-spring+mybatis
1.Syntax error on token "String", @ expected 解决:去掉类名后的括号 ps:这错误太二了 2.The nested type UserS ...
- C++编写一个简单的DLL
什么是DLL: 自从微软推出16位的Windows操作系统起,此后每种版本的Windows操作系统都非常依赖于动态链接库(DLL)中的函数和数据,实际上 Windows操作系统中几乎所有的内容都由DL ...