css实现文本超出两行隐藏
当文字显示超出两行时,多余部分文字隐藏,用到的css属性如下代码
display: -webkit-box;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: ;//当属性值为3,表示超出3行隐藏
demo
.xsConInfo{
float: left;
width: 100%;
line-height: 25px!important;
display: -webkit-box;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
效果如下::
css实现文本超出两行隐藏的更多相关文章
- CSS控制文本超出后隐藏并用省略号代替
一.仅定义text-overflow:ellipsis; 不能实现省略号效果. 二.定义text-overflow:ellipsis; white-space:nowrap; 同样不能实现省略号效果. ...
- CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行
CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加*/ ...
- CSS控制文本超出指定宽度显示省略号和文本不换行
一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加 */ width:31em;/* 何问起 hovertree.com */ word ...
- css中文本超出部分省略号代替
p{ width: 100px; //设置p标签宽度 white-space: nowrap; //文本超出P标签宽度不换行,而是溢出 overflow: hidden; //文本超出P标签,超出部分 ...
- css实现超出两行隐藏
overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-l ...
- 通过css实现文本超出部分以省略号(......)代替
一.单行溢出 1,固定宽度(非常容易) text-overflow: ellipsis; 2,不固定宽度 思路:想让这个区域成为块元素,然后不换行,溢出隐藏. display: block; whit ...
- 【css】 文本超出2行显示省略号
首先,要知道css的三条属性. overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; // ...
- css实现文本超出部分省略号显示
一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现: div { // 单行 white-space: nowrap; overflow: hidden; tex ...
- 【css】文本超出行数以省略号显示
//超出2行省略overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webk ...
随机推荐
- package.json 里的 dependencies和devDependencies区别
dependencies(依赖的意思): 通过 --save 安装,是需要发布到生产环境的.比如项目中使用react,那么没有这个包的依赖就会报错,因此把依赖写入dependencies devDep ...
- 软件测试面试-如何高质量提交缺陷bug?
从实际工作中整理,如下:如有补充可以讨论! 所以会发现现在的面试题大部分问的都是工作中出现的场景了,而不是单纯的背诵 1:充分理解需求规则.原型图,知道预期结果,操作时判断是否为bug 解析:预期结果 ...
- 分布式系列十: Redis安装和命令
redis是一个开源的, 内存数据结构存储, 一般用来作为数据库,缓存和消息代理. Redis的优势 多种数据结构 字符类型String 散列类型Hash 列表类型List 集合类型Set 有序集合类 ...
- git工具——版本的创建与回退
1.创建一个版本库 进入要管理的文件路径:cd f:/ZK/Opencv3.4.2-YOLOv3 输入命令: git init 2.版本创建与回退 在文件目录下创建一个文件code.txt: vi c ...
- 【Python】Flask中@wraps的使用
先说总结,白话来讲,@wraps相当于是装饰器的装饰器. python内置的方法使用解释,看起很复杂的样子┓( ´∀` )┏ def wraps(wrapped, assigned = WRAPPER ...
- Linux 用户组
文件权限 r w x 文件时的权限介绍 r 可读 可以使用 cat.less等命令 w 可写 可以编辑,删除此文件 x 可执行 可以命令行模式下提交给内核运行此命令 当时目录时 r 可以使用ls列出 ...
- R语言︱LDA主题模型——最优主题...
R语言︱LDA主题模型——最优主题...:https://blog.csdn.net/sinat_26917383/article/details/51547298#comments
- 爬取json Swaggerui界面
对一个静态的网页进行爬取. 要获取的内容分别为 paths 标签下的 1./quota/开头的路径 2. get 这样的httpmode 3 description对应的描述 4 summary 5 ...
- Oracle数据安全解决方案(1)——透明数据加密TDE
Oracle数据安全解决方案(1)——透明数据加密TDE2009年09月23日 22:49:00 华仔爱技术 阅读数:7991原文地址: http://www.oracle.com/technolog ...
- Mysql配置优化,库表设计
Mysql 服务器参数类型: 基于参数的作用域: 全局参数:set global autocommit = ON/OFF; 会话参数(会话参数不单独设置则会采用全局参数):set session au ...