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 ...
随机推荐
- [CVE-2017-5487] WordPress <=4.7.1 REST API 内容注入漏洞分析与复现
记录下自己的复现思路 漏洞影响: 未授权获取发布过文章的其他用户的用户名.id 触发前提:wordpress配置REST API 影响版本:<= 4.7 0x01漏洞复现 复现环境: 1) Ap ...
- python接口自动化(三十七)-封装与调用--读取excel 数据(详解)
简介 在进行软件接口测试或设计自动化测试框架时,一个不比可避免的过程就是: 参数化,在利用python进行自动化测试开发时,通常会使用excel来做数据管理,利用xlrd.xlwt开源包来读写exce ...
- profiler Reserved Total
Used Total和Reserved 均是物理内存,其中Reserved是unity向系统申请的总内存,Unity底层为了不经常向系统申请开辟内存,开启了较大一块内存作为缓存,即所谓的Reserve ...
- 笔记-JavaWeb学习之旅12
会话技术 Cookie:客户端会话技术,将数据保存到客户端 package com.data.Cookie; import javax.servlet.ServletException; import ...
- jsp 预编译
jspc-maven-plugin <?xml version="1.0" encoding="UTF-8"?> <project xmlns ...
- 微信开发(一)URL配置
启用开发模式需要先成为开发者,而且编辑模式和开发模式只能选择一个,进入微信公众平台-开发模式,如下: 需要填写url和token,当时本人填写这个的时候花了好久,我本以为填写个服务器的url就可以了( ...
- 网络请求方法(SDK封装可以替换afn)
//个人觉得 sdk开发时候 最好不要用第三方 最好可以用最原始的方法 替换 此处仅做sdk封装使用 留存+(void)GET:(NSString *)urlStr params:(NSDiction ...
- 阿里云ECS基础知识01
- libev 使用
观察器 IO ev_io_init (ev_io *, callback, int fd, int events) ev_io_set (ev_io *, int fd, int events) I/ ...
- 移动端 mui框架中input输入框或任何输入框聚焦后页面自动上移
一.mui框架中点击input后,安卓手机弹出自带的输入键盘时,页面自动上移 实现方法: (1)只要把input标签放在mui-content这个类里面就可以了 <div class=" ...