CSS div内文字显示两行,超出部分省略号显示
2021-10-01 19:15
标签:项目 oid height 世界之窗 文字 包含 ios webkit display 1. 概述 1.1 说明 在项目过程中,有时候需要控制div内文字最多显示两行,超出的使用省略号进行处理。使用识别码/前缀-webkit进行处理可直接得到相应效果。 1.1 -webkit WebKit内核的css前缀为“-webkit-”,Comodo Drangon(科摩多龙),苹果,安卓,搜狗高速浏览器3,快快浏览器,枫树浏览器,云游浏览器,360极速浏览器,世界之窗极速版,SRWare Iron,猎豹浏览器,RockMelt,QQ浏览器都可识别。 备注:IOS版的微信、android版本的X5内核,都是采用webkit内核。 2. 代码 2.1 代码示例 text-overflow属性规定当文本溢出包含元素时发生的事情 ellipsis 显示省略符号来代表被修剪的文本(单行溢出) clip 修剪文本 string 使用给定的字符串来代表被修剪的文本 -o-ellipsis-lastline 从 Opera 10.60 开始有此值,但不在标准之内 -webkit-line-clamp WebKit支持,不在标准之内(ie和火狐不兼容) .fontClass { color: #333; font-size: 28rpx; line-height: 40rpx; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } CSS div内文字显示两行,超出部分省略号显示标签:项目 oid height 世界之窗 文字 包含 ios webkit display 原文地址:https://www.cnblogs.com/ajuan/p/10419740.html
上一篇:python字典如何添加元素
文章标题:CSS div内文字显示两行,超出部分省略号显示
文章链接:http://soscw.com/index.php/essay/108297.html