当文字显示超出两行时,多余部分文字隐藏,用到的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实现文本超出两行隐藏的更多相关文章

  1. CSS控制文本超出后隐藏并用省略号代替

    一.仅定义text-overflow:ellipsis; 不能实现省略号效果. 二.定义text-overflow:ellipsis; white-space:nowrap; 同样不能实现省略号效果. ...

  2. CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行

    CSS控制文本超出指定宽度后用省略号代替,CSS控制文本不换行. 一般的文字截断(适用于内联与块): .text-overflow {     display:block;/*内联对象需加*/     ...

  3. CSS控制文本超出指定宽度显示省略号和文本不换行

    一般的文字截断(适用于内联与块): .text-overflow { display:block;/*内联对象需加 */ width:31em;/* 何问起 hovertree.com */ word ...

  4. css中文本超出部分省略号代替

    p{ width: 100px; //设置p标签宽度 white-space: nowrap; //文本超出P标签宽度不换行,而是溢出 overflow: hidden; //文本超出P标签,超出部分 ...

  5. css实现超出两行隐藏

    overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-l ...

  6. 通过css实现文本超出部分以省略号(......)代替

    一.单行溢出 1,固定宽度(非常容易) text-overflow: ellipsis; 2,不固定宽度 思路:想让这个区域成为块元素,然后不换行,溢出隐藏. display: block; whit ...

  7. 【css】 文本超出2行显示省略号

    首先,要知道css的三条属性. overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; // ...

  8. css实现文本超出部分省略号显示

    一般超出文本显示分为两种:单行超出文本和多行超出文本省略号显示,实现方式使用纯css实现: div { // 单行 white-space: nowrap; overflow: hidden; tex ...

  9. 【css】文本超出行数以省略号显示

    //超出2行省略overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webk ...

随机推荐

  1. 浅入深出Vue系列

    浅入深出Vue导航 导航帖,直接点击标题即可. 文中所有涉及到的资源链接均在最下方列举出来了. 前言 基础篇 浅入深出Vue:工具准备之WebStorm搭建及配置 浅入深出Vue之工具准备(二):Po ...

  2. 题解-UOJ 455雪灾与外卖

    Problem \(\mathrm{UOJ~455}\) 题意概要:一根数轴上有 \(n\) 只老鼠与 \(m\) 个洞,每个洞有费用与容量限制,要求每只老鼠要进一个洞且每个洞的老鼠不超过自身的容量限 ...

  3. 题解 P4705 【玩游戏】

    这题是真的神仙啊...居然用的 stl 来卡常? 话说 998244353 真的可以一眼 NTT ? noteskey 所以说只要推柿子就好了但是有的地方的推导根本就想不到... 我们令第 t 个答案 ...

  4. codeforces 813E 主席树

    题意: 一个数列多组询问,每次询问[l,r]中最多能选多少个数字,其中每个数字的出现次数不超过k次 题解: 我们保存对于每个位置上,出现超过k次的位置,那么对于每次询问,我们就变成了查询区间[l,r] ...

  5. 浅谈《Linux就该这么学》

    就在去年十月份的时候,偶尔在Linux技术群了看到别人分享的<Linux就该这么学>,好奇的就点进去看看,当时看完首页,突然发现刘遄老师说到心坎里去了,于是就仔细看了看红帽认证的讲解以及后 ...

  6. phpredis扩展实现LBS距离计算和范围筛选

    来源 public function geo(){ $redis = new \redis(); $redis -> connect('127.0.0.1',6379); //位置增加 $res ...

  7. OverFeat学习

    [OverFeat Integrated Recognition,Localization and Detection using Convolutional Networks] Pierre Ser ...

  8. 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. ...

  9. DDT驱动selenium自动化测试

    建两个.py文件分别是是读取xlsx文件内容,一个是测试用例使用ddt驱动 获取xlsx文件内容 import xlrd class ParseExcel(object): def __init__( ...

  10. Excel藏的很深(1)

    Excel 的强大功能, 神奇! 1.快速定位数据  ctrl+g 定位条件; 或者菜单中: 查找与选择->定位条件 (1) 删除所有的错误值(ref这种) (2) 实现空格自动填充0: ctr ...