文字內容溢位

display: -webkit-box;
-webkit-line-clamp: n;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;

使用text-overflow:ellipsis對溢位文字顯示省略號有兩個好處，一是不用通過程式限定字數；二是有利於seo。需要使用對對溢位文字顯示省略號的通常是文章標題列表，這樣處理對搜尋引擎更友好，因為標題實際上並未被截字，而是侷限於寬度而未被顯示而已。

通常的做法是這樣的：

1.overflow:hidden;

2.text-overflow:ellipsis;

3.-o-text-overflow:ellipsis;

4.white-space:nowrap;

5.width:100%;

其中，overflow: hidden和white-space: nowrap都是必須的否則不會顯示省略號；-o-text-overflow: ellipsis針對opera；而寬度的設定主要是針對ie6；

該方法支援internet explorer, safari, chrome 和 opera，但ff並不支援，不過可以通過jquery來實現類似的效果。

$(document).ready(function()

綠葉學習網：