移動web端css實現文本單行省略及多行省略

單行省略：

selector{
	text-overflow: ellipsis;/*這就是省略號嘍*/		  
	overflow: hidden;/*設置超過的隱藏*/
	white-space: nowrap;/*設置不斷行*/
	width:200px;/*設置寬度*/
}

多行省略：

因爲移動端瀏覽器絕大部分用的是webkit內核，所以可以用-webkit-line-clamp屬性。

-webkit-line-clamp用來限制在一個塊元素顯示的文本的行數。 爲了實現該效果，它需要組合其他的WebKit屬性。

display: -webkit-box; 必須結合的屬性 ，將對象作爲彈性伸縮盒子模型顯示 。

-webkit-box-orient 必須結合的屬性 ，設置或檢索伸縮盒對象的子元素的排列方式 。

selector{
	overflow : hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;/*此爲兩行，設置行數*/
	-webkit-box-orient: vertical;/*子元素垂直排列*/
}

注意：如果想在省略號後面加入一個查看詳細的鏈接，直接在文本後面加個<a href="#">查看詳細</a>就行了。