首页 > 技术文章 > 多行文本显示省略号...

qianduanjingying 2016-08-17 11:38 原文

支持的程度不咋的,暂时收不到相关的信息。can i use也没有这方面的消息

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Explace</title>
	<style type="text/css">
		.div1{
			display: -webkit-box;  /*必须的*/
			width:200px;
			height:50px;
			overflow: hidden;        
		    text-overflow: ellipsis; 
		    -webkit-line-clamp: 2;     /*必须的*/
		    -webkit-box-orient: vertical;   /*必须的*/
		    line-height: 1.5;
		}
	</style>
</head>
<body>
	<div class="div1">
		这样设置还要考虑一个极端的情况,就是标题不足两行。具体要看PM的需求,一是空出第二行的距离,二是让标题下边的元素顶上去。如果是第一种需求,有2种解决的方案。
	</div>
</body>
</html>

推荐阅读