<!-- 只有一行时居中显示文字,多行居左显示,最多两行超过用省略号结尾 -->
<div class="container">
	<h2><p><em>我是单行标题居中</em></p></h2>
	<h2><p><em>我是两行标题两行标题两行标题居左</em></p></h2>
	<h2><p><em>我是超过两行的标题最后点号省略我是超过两行的标题最后点号省略我是超过两行的标题最后点号省略省略省略</em></p></h2>
</div>
*{
	margin:0;
	padding:0;
}

h2 em {
	position: relative;
	font-style: normal;
	text-align: left;
	overflow : hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.container{
	width:320px;
	padding:0 10px;
	margin:10px auto;
	background: #ddd;
}

.container p {
	display: inline-block;
	text-align: center;
}

h2{
	text-align: center;
	padding:10px 0;
}
View Compiled
Rerun