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 ...
随机推荐
- 浅入深出Vue系列
浅入深出Vue导航 导航帖,直接点击标题即可. 文中所有涉及到的资源链接均在最下方列举出来了. 前言 基础篇 浅入深出Vue:工具准备之WebStorm搭建及配置 浅入深出Vue之工具准备(二):Po ...
- 题解-UOJ 455雪灾与外卖
Problem \(\mathrm{UOJ~455}\) 题意概要:一根数轴上有 \(n\) 只老鼠与 \(m\) 个洞,每个洞有费用与容量限制,要求每只老鼠要进一个洞且每个洞的老鼠不超过自身的容量限 ...
- 题解 P4705 【玩游戏】
这题是真的神仙啊...居然用的 stl 来卡常? 话说 998244353 真的可以一眼 NTT ? noteskey 所以说只要推柿子就好了但是有的地方的推导根本就想不到... 我们令第 t 个答案 ...
- codeforces 813E 主席树
题意: 一个数列多组询问,每次询问[l,r]中最多能选多少个数字,其中每个数字的出现次数不超过k次 题解: 我们保存对于每个位置上,出现超过k次的位置,那么对于每次询问,我们就变成了查询区间[l,r] ...
- 浅谈《Linux就该这么学》
就在去年十月份的时候,偶尔在Linux技术群了看到别人分享的<Linux就该这么学>,好奇的就点进去看看,当时看完首页,突然发现刘遄老师说到心坎里去了,于是就仔细看了看红帽认证的讲解以及后 ...
- phpredis扩展实现LBS距离计算和范围筛选
来源 public function geo(){ $redis = new \redis(); $redis -> connect('127.0.0.1',6379); //位置增加 $res ...
- OverFeat学习
[OverFeat Integrated Recognition,Localization and Detection using Convolutional Networks] Pierre Ser ...
- centos6.6 minimal cannot found a valid baseurl for repo :base
网上找了很久,说什么NDS1=8.8.8.8,DNS2=4.2.2.2 也有说改ifcfg-eth0文件的 总之我都改了,但都没用 现在我把我修改的流程发上来 1.https://blog.csdn. ...
- DDT驱动selenium自动化测试
建两个.py文件分别是是读取xlsx文件内容,一个是测试用例使用ddt驱动 获取xlsx文件内容 import xlrd class ParseExcel(object): def __init__( ...
- Excel藏的很深(1)
Excel 的强大功能, 神奇! 1.快速定位数据 ctrl+g 定位条件; 或者菜单中: 查找与选择->定位条件 (1) 删除所有的错误值(ref这种) (2) 实现空格自动填充0: ctr ...