CSS实现超出文本自动换行
时间: 2024-02-03 15:14:23 浏览: 124
css表格单元格中的长文本如何实现自动换行
可以使用 CSS 属性 `word-wrap` 或 `overflow-wrap` 来实现超出文本自动换行。
`word-wrap` 属性允许在单词内断开文本,以便适应包含它的容器的宽度。它有两个可能的值:
- `normal`:默认值,不在单词内断开文本。
- `break-word`:在单词内断开文本,以便适应包含它的容器的宽度。
示例代码:
```css
.container {
width: 200px;
word-wrap: break-word;
}
```
`overflow-wrap` 属性也允许在单词内断开文本,但更智能,确保在单词边界处进行断开。它有两个可能的值:
- `normal`:默认值,不在单词内断开文本。
- `break-word`:在单词内断开文本,以便适应包含它的容器的宽度。
示例代码:
```css
.container {
width: 200px;
overflow-wrap: break-word;
}
```
这两个属性的表现非常相似,通常可以互换使用。
阅读全文