css设置使文字显示2行多余的为省略号。。。
.title{
font-size: .7rem;
line-height: 1.5rem; overflow: hidden; /** 隐藏超出的内容 **/
word-break: break-all;
text-overflow: ellipsis; /** 多行 **/
display: -webkit-box; /** 对象作为伸缩盒子模型显示 **/
-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp: 2; /** 显示的行数 **/
margin-bottom: .3rem;
}
css设置使文字显示2行多余的为省略号。。。的更多相关文章
- css设置使文字显示2行多余的为省略号...
1 2 3 4 5 6 7 8 9 10 11 12 .title{ font-size: .7rem; line-height: 1.5rem; ove ...
- 使用css控制文字显示几行并且剩余部分隐藏(移动端和PC端同样适用)
前言 有些需求需要我们控制一段文本最多显示几行,就像逛淘宝京东的评价楼层一样,有时可能还需要隐藏剩余部分,这样的需求我们怎么来解决呢? 解决办法 我们完全可以使用css来解决这一需求 1. 解决文本显 ...
- css: transform导致文字显示模糊
css: transform导致文字显示模糊 有人认为模糊的原因是:"transform时div的宽度或者高度并不是偶数,偏移 50% 之后,像素点不是整数,和显示像素没有对上". ...
- css让文字显示特定行数,多余的显示省略号
/*css*/ .p{ width: 200px; word-break: break-all; text-overflow: ellipsis; display: -webkit-box; /** ...
- CSS div内文字显示两行,超出部分省略号显示
1. 概述 1.1 说明 在项目过程中,有时候需要控制div内文字最多显示两行,超出的使用省略号进行处理.使用识别码/前缀-webkit进行处理可直接得到相应效果. 1.1 -webkit WebKi ...
- CSS小技巧-怎样让每行多余的文字显示文省略号?
1.white-space:nowrap 如果是中文,则需要设置行末不断行 2.overflow:hidden 设置超出控件范围隐藏 3.text-overflow:ellipsis
- html div内第二行文字显示不下的时候才用省略号代替 css实现
有时候文字太多,但为了美观想要在第二行的时候才显示省略号,而不是第一行超出马上就出现省略号 下面是css代码: overflow:hidden;text-overflow: ellipsis;//显示 ...
- css设置字体单行,多行超出省略号显示
单行: overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行 display: -webkit-box; -webkit- ...
- 移动端布局的一些设置(在viewport里设置使页面显示相同宽度,显示相同像素大小)
viewport(视口) 具体数值(不设置时默认为980 ,部分安卓手机不支持设置成具体数值) width=device-width 和设备宽度保持一致 user-scalable=no 是否允许用户 ...
随机推荐
- python脚本编写(纯干货)
写博客的经验不是很多,写的不好或者有什么建议请留言或者联系作者 文章所有权归作者所有,转载转发请联系作者,侵权必纠. 废话不多说,直接开始吧! python脚本的作用也就不说了,首先是一个reques ...
- C语言之路
C 简介 C 语言是一种通用的高级语言,最初是由丹尼斯·里奇在贝尔实验室为开发 UNIX 操作系统而设计的.C 语言最开始是于 1972 年在 DEC PDP-11 计算机上被首次实现. 在 1978 ...
- 2019-10-9:渗透测试,基础学习,php文件上传,mysql基础
header("Content-Type:text/html;charst="utf-8")设置头部信息,解决编码问题setcookie("loginStrin ...
- Tensorflow的基本使用
基本使用 使用 TensorFlow, 你必须明白 TensorFlow: • 使用图 (graph) 来表示计算任务. • 在被称之为 会话(Session)的上下文 (context) 中执行图. ...
- App自动化测试-1.App自动化介绍和环境搭建
App自动化测试-1.App自动化介绍和环境搭建 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-b ...
- .net压缩文件
首先nuget安装DotNetZip 代码很少
- 【Android - 进阶】之Animation补间动画
补间动画也叫View动画,它只能针对View进行动画操作,且补间动画操作的只是View中可见的部分,即只操作界面,对于可点击区域等都不会进行操作. 在Android中,补间动画的顶级类是Animati ...
- 相关性不一定等于因果性:从 Yule-Simpson’s Paradox 讲起
1. 两件事伴随发生,不代表他们之间有因果关系 - 从一些荒诞相关性案例说起 在日常生活和数据分析中,我们可以得到大量相关性的结论,例如: 输入X变量,有98%置信度得到Y变量 只要努力,就能成功 只 ...
- 对python的初步了解
一,Python简介 Python 是一个高层次的结合了解释性.编译性.互动性和面向对象的脚本语言. Python 的设计具有很强的可读性,相比其他语言经常使用英文关键字,其他语言的一些标点符号,它具 ...
- SpringBoot打成war包,部署Tomcat服务器
1: 创建spring boot项目 使用 Spring initializr 可以直接选择创建包的方式 也可以选择在Pom中更改 <groupId>com.dgw</grou ...