在網頁設計和開發中，經常需要在一定的寬度限制內顯示一段文本，當文本長度過長時，我們希望可以自動縮略顯示，這時我們就可以使用 CSS 的 text-overflow 屬性。本文將介紹如何使用 text-overflow 屬性來實現兩行后自動省略號。

text-overflow 屬性指定當文本溢出父元素時應該怎樣顯示。默認情況下，文本溢出父元素時是被隱藏的。通過設置 text-overflow 屬性為 ellipsis，我們可以讓文本溢出時自動顯示省略號。

但是，設置 text-overflow 為 ellipsis 并不能讓文本自動換行。如果一行文本太長，超出父元素的寬度，那么就會被截斷并且顯示省略號。為了讓文本自動換行，我們還需要使用 white-space 屬性設置為 nowrap。這樣就能讓文本自動換行，并在溢出時顯示省略號。

.overflow {
white-space: nowrap; /* 強制不換行 */
text-overflow: ellipsis; /* 超出截斷并顯示省略符號 */
overflow: hidden; /* 超出部分隱藏 */
display: inline-block; /* 以行內塊元素顯示 */
max-width: 200px; /* 設置最大寬度 */
line-height: 20px; /* 設置行高 */
}

以上代碼設置最大寬度為 200px，行高為 20px，如果一行文本超過了 200px，就會自動換行，同時當超出一定高度時，就會顯示省略號。你也可以根據實際需求來調整這些值。

通過設置 text-overflow 和 white-space 屬性，我們可以輕松的實現在兩行后自動省略號的效果。在實際開發中，這種效果非常實用，可以極大的提升用戶體驗。