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

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

```