https://baijiahao.baidu.com/s?id=1621362934713048315&wfr=spider&for=pc
1）單行文本溢出顯示省略號
當我們在編寫網頁代碼的時候，肯定會遇到過文字列表中的文字太多超出了我們所寫的寬度，導致文本換行或者文本超出了界限，這時有人就會說了，讓後臺限制一下調用的文字個數不就行了嗎，但是我們在做響應式的時候由於是百分比佈局，無法計算一行會顯示多少個文字，所以這並不是一個好的解決方案，我們使用css3就可以輕鬆的實現，而且簡單好用。
核心css語句：
1、overflow:hidden; （顧名思義超出限定的寬度就隱藏內容）
2、white-space: nowrap; （設置文字在一行顯示不能換行）
3、text-overflow: ellipsis;（規定當文本溢出時顯示省略符號來代表被修剪的文本）
我們具體的代碼效果演示就如下圖所示：（設置ul寬度爲300，超出的文字內容讓其自動隱藏並顯示…）
2）多行文本溢出顯示省略號
我們在編寫網頁代碼時，有時候新聞列表頁中新聞簡介可能有一行或者多行，我們要如何處理這種問題，讓其超出多行後還能顯示省略號呢，不要慌，我們css還是很強大的，已經給我們提供了方法來處理這種問題了。
核心css語句：
1、-webkit-line-clamp:2; （用來限制在一個塊元素顯示的文本的行數,2表示最多顯示2行。 爲了實現該效果，它需要組合其他的WebKit屬性）
2、display: -webkit-box; （和1結合使用，將對象作爲彈性伸縮盒子模型顯示 ）
3、-webkit-box-orient:vertical;（ 和1結合使用 ，設置或檢索伸縮盒對象的子元素的排列方式 。）
4、overflow:hidden; （顧名思義超出限定的寬度就隱藏內容）
5、text-overflow: ellipsis;（規定當文本溢出時顯示省略符號來代表被修剪的文本）
我們具體的代碼效果演示就如下圖所示：（設置段落p寬度爲300，超出2行的文字內容讓其自動隱藏並顯示…）
