单行超出显示省略号

display: block;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;

多行超出显示省略号

1、普通HTML文本(要内联样式)

-webkit-box-orient: vertical;这句要写在内联里面,写在内部css就是没用。
display: -webkit-box;
word-break: break-all;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;

2、小程序

display: -webkit-box;
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp:2;

文本超出显示省略号CSS的更多相关文章

  1. 文本超出显示省略号/数字英文字母折行有关css 属性/显示两行,第二行省略号显示css方法

    文本超出显示省略号: 定容器宽度 overflow: hidden; text-overflow: ellipsis; 文本超出显示省略号 white-space:nowrap;  强制文本不换行 折 ...

  2. EasyUI datagrid单元格文本超出显示省略号,鼠标移动到单元格显示文本

    nowrap : true;  是前提 $('#×××').datagrid({ nowrap : true,//设置为true,当数据长度超出列宽时将会自动截取 }); 省略号样式: <sty ...

  3. css文本超出部分省略号&CSS强制换行总结

    word-break:break-all单词截断自动换行 word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congra ...

  4. css文字单行/多行超出显示省略号...

    css文字单行/多行超出显示省略号... 项目里写css样式我们经常会遇到将文字超出显示省略号的情况,记录一下以后能用到. 单行超出 .oneline { width:300upx; /*宽度一定要设 ...

  5. CSS文本溢出显示省略号

    项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英雄指教. 单行 语法 ...

  6. CSS控制文字显示一行,超出显示省略号

    这几天在项目需求里面遇到了很多之前没做过的需求,也慢慢更加认识到了css的强大,是真的强大.以后会把自己技术调研的东西都写出来,哪怕只是一点点或者很小的点,重在学习. “CSS控制文字显示一行,超出显 ...

  7. CSS单行文本溢出显示省略号

    此为转载,原文地址 项目中常常有这种需要我们对溢出文本进行"..."显示的操作,单行多行的情况都有(具体几行得看设计师心情了),这篇随笔是我个人对这种情况解决办法的归纳,欢迎各路英 ...

  8. CSS自己主动换行、强制不换行、强制断行、超出显示省略号

    P标签是默认是自己主动换行的,因此设置好宽度之后,可以较好的实现效果,可是近期的项目中发现,使用ajax载入数据之后.p标签内的内容没有换行,导致布局错乱,于是尝试着使用换行样式,尽管攻克了问题.可是 ...

  9. css实现单行、多行文本超出显示省略号

    前言:项目中我们经常遇到这种需求,需要对单行.多行文本超出显示为省略号.这篇文章主要总结了小编解决此问题的方法,有不足之处欢迎大家指正. 单行文本省略 .ellipsis-line { border: ...

随机推荐

  1. 轻松使用 Redis slowlog

    之前中秋项目搞活动,用户比较活跃 SE.Redis 频繁报 Timeout 异常,狂翻了一波 issues 发现提这个问题还蛮多的,作者非常频繁的提到使用 slowlog 这个命令进行排查,那么问题就 ...

  2. Springboot优化

    https://www.cnblogs.com/chen110xi/p/6198481.html

  3. Looksery Cup 2015 Editorial

    下面是题解,做的不好.下一步的目标是rating涨到 1800,没打过几次cf A. Face Detection Author: Monyura One should iterate through ...

  4. Linux平台下Ntop流量监测安装,并实现Netflow全过程

    Linux平台下Ntop流量监测安装,并实现Netflow全过程 更多原创教学视频详见: http://you.video.sina.com.cn/m/1443650204 本文出自 "李晨 ...

  5. HDU 6153 A Secret

    A Secret Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 256000/256000 K (Java/Others)Total ...

  6. tcp为什么要三次握手

    作者:大闲人柴毛毛链接:https://www.zhihu.com/question/24853633/answer/254224088来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转 ...

  7. ubuntu 进入临时客户会话页面 转入用户自己页面

    1.点击右上角的按钮 2.选择要登录的客户名字 点击进入 3.输入账号密码 进入指定的账号

  8. Android中级第十讲--相机录像和查看系统相册图片

    博客出自:http://blog.csdn.net/liuxian13183,转载注明出处! All Rights Reserved ! 录像比较简单,开始录制: myCamera.unlock(); ...

  9. Android 多种方式正确的载入图像,有效避免oom

    图像载入的方式:        Android开发中消耗内存较多一般都是在图像上面.本文就主要介绍如何正确的展现图像降低对内存的开销,有效的避免oom现象. 首先我们知道我的获取图像的来源一般有三种源 ...

  10. Poj1734题解

    题目大意 求一个无向图的最小环 题解 假设是有向图的话.仅仅须要令f[i][i]=+∞,再floyd就可以: 对无向图.应该在floyd算法循环至k的一開始进行例如以下操作: 枚举i和j,假设点i存在 ...