web前端超出兩行用省略號表示

HTML

<span class="GW_bod0112211">
  吐魯番特級無炳黑加侖葡萄乾500g包郵無籽吐魯番特級無炳黑加侖葡萄乾500g包郵無籽吐魯番特級無炳黑加侖葡萄乾500g包郵無籽，超大孕婦零食
</span>

CSS

span{
	height: 40px;
	line-height: 20px;
	width: 300px;
	display: -webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
	overflow: hidden;
}

 這個屬性應用在移動端兼容性比較好。

效果以下：