html5文本超过指定行数隐藏显示省略号
这个很简单,直接贴代码就好了
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文本超过指定行数隐藏显示省略号的更多相关文章
- CSS文本超出指定行数省略显示
单行: overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 2行: font-size: 17px;overflow: hi ...
- 多行溢出隐藏显示省略号功能的JS实现
在页面重构中,经常需要将过多的内容隐藏而显示部分.在单行文本中实现非常简单,但是在多行文本中,则需要根据实际选择不同的方式. 用CSS实现多行溢出隐藏的代码非常简单,但是兼容性也相对较低. displ ...
- Vue:列表展开和收起(超过一定行数时显示‘查看更多’按钮)
前言:前端小白记录的一些小功能~ 公司开发中的小程序中有做任务签到的功能,这就涉及到了任务列表以及对任务列表的展开和收起功能,好了可以开始了,说多了就烦了 1.首先是css样式,因为设计稿上是超过两行 ...
- 文本超过控件长度自动显示省略号的css
overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
- css3实现超出文本指定行数(指定文本长度)用省略号代替
测试代码: <!DOCTYPE html> <html> <head> <meta name="viewport" content=&qu ...
- css 实现文本换行及显示不下隐藏显示省略号
CSS文本超出2行就隐藏并且显示省略号 转载:https://www.cnblogs.com/wyaocn/p/5830364.html 今天做东西,遇到了这个问题,百度后总结得到了这个结果. 首 ...
- CSS——文本超出隐藏显示省略号
文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...
- .Net_用控制台程序打印指定行数的三角型(面试题)
.Net_用控制台程序打印指定行数的三角型(面试题) 下面是一个由*号组成的4行倒三角形图案.要求: 1.输入倒三角形的行数,行数的取值3-21之间,对于非法的行数,要求抛出提示“非法行数!”: ...
- Linux查看文件指定行数内容
1.tail date.log 输出文件末尾的内容,默认10行 tail -20 date.log 输出最后20行的内容 tail -n -20 date ...
随机推荐
- 洛谷 - P1582 - 倒水 - 位运算
https://www.luogu.org/problemnew/show/P1582 要求用最少的瓶子,那肯定不能有两个一样的瓶子,否则合并更优. 枚举其二进制位,每次加上lowbit,将最后一个1 ...
- 51nod 1011 【完全背包】
完全背包的变形: 这些数字可以取多次,dp[i]代表前 i 物品组成N时的方案数. #include<iostream> #include<cstring> #include& ...
- ugui学习资料
官网文档 http://docs.unity3d.com/Manual/index.html 官网视频教程http://unity3d.com/learn/tutorials/modules/begi ...
- 新装ubuntu 12.04 , 使用技巧
*********************************************** 一.让Ubuntu 12.04开机默认进入命令行模式. 修改 /etc/default/grubGRUB ...
- Bootstrap Table 从新InsertRow 刷新表格 数据的问题处理方案
1.第一步获取数据源 var rows = { //要插入的数据,这里要和table列名一致SkuCode: data.rows[i].SkuCode,BarCode: data.rows[i].Ba ...
- DRF教程3-类视图
Rewriting our API using class-based views 使用类视图重写root views,只需要一点点重构. from django.http import Http40 ...
- 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 ...
- python中的os.path.dirname与os.path.dirname(__file__)的用法
python中的os.path.dirname的用法 os.path.dirname(path) 语法:os.path.dirname(path) 功能:去掉文件名,返回目录 如: print(os. ...
- nodejs 学习(2) 中间件
var connect=require('connect'), morgan=require('morgan'),//日志 bodyparser=require('body-parser'), ses ...
- VMware下OSSIM 5.2.0的下载、安装和初步使用(图文详解)
不多说,直接上干货! 入门阶段不建议选用最新的版本. 采用OSSIM 4.11 到 OSSIM5.0.3 之间任何版本做实验,sensor的状态都会是“V”. 建议,入门,采用OSSIM5.0.0 ...