控制文章行数
来源:互联网 发布:fifa online3网络延迟 编辑:程序博客网 时间:2024/05/29 18:28
一个简单的控制文章行数的方法,不多说,先上代码
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title></head><style> p { width:300px; margin:0 auto; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 5; }</style><body> <p> 梦想总是完美的,然而寻梦的旅程我已走了一半,每当我双手敲击着键盘时, 便又是一段心事的诉说, 很多人说我该过正常人的生活,像他们一样,那样 简单的生活。也许我生下来就是如此倔强,总是不 愿向命运妥协,也许正是 正因我的倔强,因此很辛苦,走的每一步都是那么战战巍巍,但是这样的波 澜壮阔,我愿意享受其中,正因我觉得日子有荆棘,才有奋进的勇气和动力。 </p></body></html>
效果图奉上:
这里说几点:
1、不局限于p标签
2、不要给这个内容块设padding-bottom
给你们看看设了padding-bottom的后果
width:300px; border:1px solid red; margin:0 auto; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 5; padding-bottom:50px;//这里我设了padding-bottom
上图
是不是发现了什么!!!
阅读全文
0 0
- 控制文章行数
- android ScrollView 控制行数
- css控制行数
- gridview控制显示行数
- edittext 控制行数
- css 控制文本行数
- 基于行数预测的长文章分页
- Linux下如何查看文章的行数
- android EditText控制最大输入行数
- Dynamics CRM2013 picklist下拉项行数控制
- android EditText控制最大输入行数
- eclipse中console的输出行数控制
- SVN控制参考文章
- 查询单词在文章中出现的行和行数
- vfp控制excel相关文章
- jquery控制文章自动加长
- 控制DATAWINDOW里每页显示的行数
- 控制每页显示行数及隔行换色
- Maven安装jar到本地仓库
- 蜂鸣器电路下拉电阻作用
- tarjan算法求解强连通分量
- Swift 4.0 正式发布,更快更兼容更好用
- Markdown编辑器写博客备忘
- 控制文章行数
- Vue从0到1(一):用webpack打包vue
- Git入门介绍-3-把本地项目提交到Github
- 怎样读书才有可能改变命运
- 1245 最小的N个和
- Tomcat显示8080端口被占用
- Libevent-2.1.8源码分析——event_base(二)
- 文章分享插件
- 剑指offer