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 ...
随机推荐
- MR 图像分割 相关论文摘要整理
<多分辨率水平集算法的乳腺MR图像分割> 针对乳腺 MR 图像信息量大.灰度不均匀.边界模糊.难分割的特点, 提出一种多分辨率水平集乳腺 MR图像分割算法. 算法的核心是首先利用小波多尺度 ...
- LeetCode: 520 Detect Capital(easy)
题目: Given a word, you need to judge whether the usage of capitals in it is right or not. We define t ...
- 使用WebStorm/IDEA上传本地项目到GitHub
在使用 WebStorm/IDEA 上传本地项目到 GitHub 之前,先要做一些相关配置. 以 WebStorm 为例,IDEA 同. 首先打开 WebStorm ,依次点击File -> S ...
- npm切换到淘宝镜像
1. npm简介 1.1.说明:npm(node package manager)nodejs的包管理器,用于node插件管理(包括安装.卸载.管理依赖等): 1.2.使用npm安装插件:命令提示符执 ...
- UVALive 7327【模拟】
题意: 每次方案一个或多个子序列: 每个子序列要整除m 认为分割不同,子序列边界的不同就是不同: 1246有4个 1246 12 46 124 6 12 4 6 思路: 先从整体考虑,因为取膜适用于加 ...
- AutoLayout 根据文字、图片自动计算 UITableViewCell 高度
原文网址: http://lvwenhan.com/ios/449.html 此系列文章代码仓库在 https://github.com/johnlui/AutoLayout ,有不明白的地方可以参考 ...
- StringUtils.split()和string.split()的区别
场景 出于业务考虑,将多个字符串拼接起来时,使用的分隔符是;,;.如果要将这样一个拼接来的字符串分割成原本的多个字符串时,就需要使用到jdk自带的split()方法.不过因为公司的编程规范,改为使用了 ...
- android 多线程下载思路
首先请求下载url,获取文件大小和文件类型 比如获取到文件大小是7410642 文件类型为application/vnd.android.package-archive(即后缀为apk,安卓app安 ...
- gns3 拖出设备显示一个红色的s,无法启动虚拟设备
通过view-docks-调出console窗口,显示错误信息: Error while creating project: Can't connect to server http://172.0. ...
- SqlServer存储过程调用接口
因项目需求.需实现新增数据->触发器->存储过程->调用接口. https://blog.csdn.net/u010485134/article/details/58603370 另 ...