對于text-overflow:ellipsis，文本超出部分顯示...，但要實現這個效果，卻有一些必備條件，如下：

div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;/*其他屬性*/ }

三個條件缺一不可，但是這些屬性只能實現一行文本顯示...，而對于要顯示多行文本，并且只有最后一行顯示...，就不適用了，所以需要修改樣式，如下：

div{overflow: hidden;text-overflow: ellipsis;height: 60px;display: -webkit-box; -webkit-line-clamp: 3; /*可指定任一行顯示...效果*/ -webkit-box-orient: vertical; /*此時不需要white-space:nowrap;*/ }

看到新增的屬性，應該就知道，他不是通用的，只針對webkit內核瀏覽器，而對于最TM神奇的IE瀏覽器，只能使用插件了，jq插件地址：http://dotdotdot.frebsite.nl/，使用方法，如下：

?

轉載于:https://www.cnblogs.com/web-wjg/p/7424403.html

總結

以上是生活随笔為你收集整理的CSS3属性之text-overflow:ellipsis,指定多行文本中任意一行显示...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。