在網頁設計中，我們經常會遇到需要隱藏多余文字的情況。比如在輪播圖中，為了使整個頁面布局更美觀，我們希望在圖片下面顯示一行簡短的文字，而不是一整段內容。那么如何實現這個效果呢？接下來我們就來探討一下通過CSS來隱藏多余文字的方法。 方法一：使用text-overflow屬性 text-overflow屬性可以用來設置當一個元素中的文本超出容器寬度時，如何顯示多余的文本。常見的屬性值有三種：ellipsis（省略號）、clip（裁剪）和string（字符串）。其中，我們可以通過設置ellipsis來實現隱藏多余文字的效果。代碼如下：

p {
white-space: nowrap; /* 設置不換行 */
overflow: hidden; /* 隱藏超出部分 */
text-overflow: ellipsis; /* 使用省略號代替多余的內容 */
}

方法二：使用max-width屬性 max-width屬性可以設置元素的最大寬度，當元素中的文本超出設置的寬度時，就會自動換行。因此，我們可以將max-width設置為一個比較小的值，來隱藏多余的文字。代碼如下：

p {
max-width: 200px; /* 設置最大寬度 */
overflow: hidden; /* 隱藏超出部分 */
white-space: nowrap; /* 設置不換行 */
}

通過上述方法，我們就可以實現在不改變原有布局的情況下，隱藏多余的文字，使頁面更加美觀。簡單易用，不妨一試！