这个很简单,直接贴代码就好了

HTML

<span class="name">博客园是一个面向开发者的知识分享社区。自创建以来,博客园一直致力并专注于为开发者打造一个纯净的技术交流社区,推动并帮助开发者通过互联网分享知识,从而让更多</span>

CSS

span{
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:;
-webkit-box-orient: vertical;
}

这里用span没用p标签不要有疑问,根据情况来确定使用的标签,

这里是指定两行,超出两行显示省略号

html5文本超过指定行数隐藏显示省略号的更多相关文章

  1. CSS文本超出指定行数省略显示

    单行: overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 2行: font-size: 17px;overflow: hi ...

  2. 多行溢出隐藏显示省略号功能的JS实现

    在页面重构中,经常需要将过多的内容隐藏而显示部分.在单行文本中实现非常简单,但是在多行文本中,则需要根据实际选择不同的方式. 用CSS实现多行溢出隐藏的代码非常简单,但是兼容性也相对较低. displ ...

  3. Vue:列表展开和收起(超过一定行数时显示‘查看更多’按钮)

    前言:前端小白记录的一些小功能~ 公司开发中的小程序中有做任务签到的功能,这就涉及到了任务列表以及对任务列表的展开和收起功能,好了可以开始了,说多了就烦了 1.首先是css样式,因为设计稿上是超过两行 ...

  4. 文本超过控件长度自动显示省略号的css

    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;

  5. css3实现超出文本指定行数(指定文本长度)用省略号代替

    测试代码: <!DOCTYPE html> <html> <head> <meta name="viewport" content=&qu ...

  6. css 实现文本换行及显示不下隐藏显示省略号

    CSS文本超出2行就隐藏并且显示省略号 转载:https://www.cnblogs.com/wyaocn/p/5830364.html   今天做东西,遇到了这个问题,百度后总结得到了这个结果. 首 ...

  7. CSS——文本超出隐藏显示省略号

    文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...

  8. .Net_用控制台程序打印指定行数的三角型(面试题)

    .Net_用控制台程序打印指定行数的三角型(面试题)   下面是一个由*号组成的4行倒三角形图案.要求: 1.输入倒三角形的行数,行数的取值3-21之间,对于非法的行数,要求抛出提示“非法行数!”: ...

  9. Linux查看文件指定行数内容

    1.tail date.log               输出文件末尾的内容,默认10行 tail -20  date.log        输出最后20行的内容 tail -n -20  date ...

随机推荐

  1. 洛谷 - P1582 - 倒水 - 位运算

    https://www.luogu.org/problemnew/show/P1582 要求用最少的瓶子,那肯定不能有两个一样的瓶子,否则合并更优. 枚举其二进制位,每次加上lowbit,将最后一个1 ...

  2. 51nod 1011 【完全背包】

    完全背包的变形: 这些数字可以取多次,dp[i]代表前 i 物品组成N时的方案数. #include<iostream> #include<cstring> #include& ...

  3. ugui学习资料

    官网文档 http://docs.unity3d.com/Manual/index.html 官网视频教程http://unity3d.com/learn/tutorials/modules/begi ...

  4. 新装ubuntu 12.04 , 使用技巧

    *********************************************** 一.让Ubuntu 12.04开机默认进入命令行模式. 修改 /etc/default/grubGRUB ...

  5. Bootstrap Table 从新InsertRow 刷新表格 数据的问题处理方案

    1.第一步获取数据源 var rows = { //要插入的数据,这里要和table列名一致SkuCode: data.rows[i].SkuCode,BarCode: data.rows[i].Ba ...

  6. DRF教程3-类视图

    Rewriting our API using class-based views 使用类视图重写root views,只需要一点点重构. from django.http import Http40 ...

  7. ICM Technex 2017 and Codeforces Round #400 (Div. 1 + Div. 2, combined) C

    Molly Hooper has n different kinds of chemicals arranged in a line. Each of the chemicals has an aff ...

  8. python中的os.path.dirname与os.path.dirname(__file__)的用法

    python中的os.path.dirname的用法 os.path.dirname(path) 语法:os.path.dirname(path) 功能:去掉文件名,返回目录 如: print(os. ...

  9. nodejs 学习(2) 中间件

    var connect=require('connect'), morgan=require('morgan'),//日志 bodyparser=require('body-parser'), ses ...

  10. VMware下OSSIM 5.2.0的下载、安装和初步使用(图文详解)

    不多说,直接上干货! 入门阶段不建议选用最新的版本. 采用OSSIM 4.11 到 OSSIM5.0.3 之间任何版本做实验,sensor的状态都会是“V”.   建议,入门,采用OSSIM5.0.0 ...