CSS控制文本超出 CSS能夠控制文本超出的方式有很多，以下分享一些常見的方法。 1. text-overflow 使用text-overflow屬性來控制在一行寬度內超過容器寬度的文本如何處理。 代碼示例: ``` p { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } ``` 解釋: - overflow: hidden - 隱藏超出容器的文本。 - white-space: nowrap - 防止文本換行。 - text-overflow: ellipsis - 顯示省略號(...)來表示被截斷的文本。 2. word-wrap 使用word-wrap屬性來控制文本在容器邊界處斷行的方式。 代碼示例: ``` p { word-wrap: break-word; } ``` 解釋: - word-wrap: break-word - 當文本超出容器寬度時，強制在單詞之間斷開換行。 3. white-space 使用white-space屬性來控制空格如何處理。 代碼示例: ``` p { white-space: nowrap; } ``` 解釋: - white-space: nowrap - 防止文本換行并保留所有空格符。 4. overflow 使用overflow屬性來控制文本溢出容器的方式。 代碼示例: ``` p { overflow: scroll; } ``` 解釋: - overflow: scroll - 在容器內添加滾動條以便滾動查看超出容器的文本。 以上是一些常見的CSS控制文本超出的方法，根據實際需求選擇合適的方法來展示文本，即可達到更好的用戶體驗效果。 代碼片段: ```

p {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
p {
word-wrap: break-word;
}
p {
white-space: nowrap;
}
p {
overflow: scroll;
}

```