CSS限制顯示字數超出部分用省略符號表示

為了保證頁面的整潔美觀，在很多的時候，我們常需要隱藏超出長度的文字。這在列表條目，題目，名稱等地方常用到。

(1).文字超出一行，省略超出部分，顯示'...'

如果這種情況比較多，可以取一個切合作用的類名用於複用。

.line-limit-length {overflow: hidden;text-overflow: ellipsis;white-space: nowrap; //文本不換行，這樣超出一行的部分被截取，顯示...}<p class="item"><p class="line-limit-length">最新訊息：神秘地球黑洞深不可測，不停吸入周圍海水。</p><i class="icon icon-arrow-go"></i> //表徵圖字型</p>

(2). 可以給定容器寬度限制，超出部分省略

.product-buyer-name {max-width: 110px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}<h5 class="product-buyer-name">橘子橘子</h5>