CSS中字符太長截取 在CSS中，我們經常需要控制文字長度，比如網頁排版時需要讓文字在一行內顯示，如果文字太長，就需要進行截取。那么，如何在CSS中控制字符太長時的截取呢？ 一、使用text-overflow屬性 text-overflow屬性定義當文本溢出包含它的元素時發生的事情。通過設置text-overflow:ellipsis，可以用省略號來代替溢出的文本。 例如，我們在以下代碼的pre標簽中設置了溢出的寬度為120px，同時設置了text-overflow:ellipsis：

p {
width: 120px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

這樣，如果p標簽中的文字超過了120px的寬度，那么就會用省略號來代替溢出的文本。 二、使用word-wrap屬性 word-wrap屬性定義瀏覽器如何在單詞內換行。通過設置word-wrap:break-word，可以讓長單詞在適當的位置分割成兩個串，從而達到截取的效果。 例如，我們在以下代碼的pre標簽中設置了寬度為200px，同時設置了word-wrap:break-word：

p {
width: 200px;
word-wrap: break-word;
}

這樣，如果p標簽中的文字超過了200px的寬度，那么長單詞就會被適當的截取成兩個串，從而實現截取的效果。 三、使用display屬性 通過設置display屬性為inline-block，我們可以把一個長文本截取成多個行，并且在一定程度上控制每一行的長度。 例如，我們在以下代碼的pre標簽中設置了寬度為200px，同時設置了display:inline-block：

p {
width: 200px;
display: inline-block;
}

這樣，如果p標簽中的文字超過了200px的寬度，那么就會分成多個行，并且在一定程度上控制每一行的長度。 總結 通過對text-overflow屬性、word-wrap屬性、display屬性的掌握，我們可以在CSS中靈活地控制字符太長時的截取效果。在網頁排版中，合理地使用字符截取，不僅可以提升排版美感，還可以優化網頁的閱讀體驗。