CSS文字或英文为什么不会自动换行?有什么方法?
发布时间:2024-06-03 00:58:10
阅读:222
字数:430
CSS文字自动换行
要使选择器中的文字自动换行,可以使用CSS的word-wrap属性或者overflow-wrap属性。另外,还可以使用white-space属性来控制空白字符的处理方式。

以下是几种实现方式:


1.使用word-wrap: break-word;属性,允许在长单词或URL地址内部进行换行:


div {
  word-wrap: break-word;
}
2.使用overflow-wrap: break-word;属性,与word-wrap类似,但是更推荐用于现代浏览器:



div {
  overflow-wrap: break-word;
}
3.使用white-space: normal;属性,允许自动换行,但不会改变空格的处理:



div {
  white-space: normal;
}
4.使用white-space: pre-wrap;属性,允许自动换行,并保留空格:



div {
  white-space: pre-wrap;
}