css多行文本溢出显示省略号
2024-09-03 08:08:54
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body> <div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatem est libero fugit placeat distinctio deserunt ipsam eveniet, odit officiis laudantium, quos, corporis saepe earum id quia unde impedit atque quod.
</div> </body>
</html>
CSS:
div {
width:400px;
overflow:hidden;
text-overflow: ellipsis;
word-break: break-all;/*一个单词为了换行好看,允许被拆开*/
-webkit-box-orient:vertical;
-webkit-line-clamp:;
display: -webkit-box; /*必须结合的属性 ,将对象作为弹性伸缩盒子模型显示 。*/
}
结果:
最新文章
- php知识案列分享
- cocos2d-x之 利用富文本控件解析xhml标签(文字标签,图片标签,换行标签,标签属性)
- 说说React
- 利用writing-mode实现元素的垂直居中
- MFC Edit控件 追加文本
- linux添加时间提示符
- -(UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
- 给Chrome和Firefox添加js脚本作为插件的方法
- js两个时间比较
- 线程间操作无效: 从不是创建控件&ldquo;textBox2&rdquo;的线程访问它
- [ES6] Array -- Destructuring and Rest Parameters &;&; for ..of &;&; Arrat.find()
- SQL Server -减少代码触发的负担
- 采用tcpdump攫Android网络数据包
- Python 项目实践二(生成数据)第一篇
- go基础系列:简介
- 【原创】python 豆瓣采集
- bitbucket迁移
- hadoop_spark伪分布式实验环境搭建和运行实例详细教程
- 使用ActivityGroup需要注意的地方
- Python中的垃圾回收机制