-
首先編寫正常狀態超出文本隱藏的效果；代碼如下
overflow: hidden;
-
下面是單行超出文本出現省略號的效果；代碼如下
overflow:hidden; text-overflow:ellipsis; white-space:nowrap
這裏最好給標籤添加上高度，或者設置文字不能換行
-
顯示單行省略號效果
-
下面是多行超出文本出現省略號的效果；代碼如下
overflow: hidden;text-overflow: ellipsis; display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;
這裏要注意不要給標籤添加高度，讓文字自動撐開多行就行
-
顯示多行省略號效果
注意事項
-
多行省略號的方法只適合谷歌WebKit內核的瀏覽器，可以用其他方法實現
-
每天進步一點點！希望對大家有幫助