word-break/word-wrap

本文详细介绍了CSS中word-break、word-wrap及white-space等属性的使用方法,包括如何控制文本自动换行、单词间换行规则以及空白符处理等。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

word-break让文本自动换行

normal  使用浏览器默认换行规则

              对于西方文字来说,浏览器会在半角空格或连字符的地方自动换行,而不会在单词的当中突然换行。

             对于中文来说,可以在任何一个中文字后面进行换行。

             如果中文当中含有西方文字,浏览器也会在半角空格或连字符的地方进行换行,而不会在单词中间强制换行。

            当中文中有标点符号时,通常将符号前面一个字作为整体统一换行。

keep-all 只能在半角空格或连字符处换行。

break-all允许在单词内进行换行(相当于两端对齐)

word-wrap让长单词与URL地址自动换行

normal默认,只在半角空格或连字符的地方进行换行

 break-word带有怜悯之心,如果这一行文字有可以换行的点,如空格,或CJK(Chinese/Japanese/Korean)(中文/日文/韩文)之类的,则就不打英文单词或字符的主意了,让这些换行点换行,至于对不对齐,好不好看,则不关心,因此,很容易出现一片一片牛皮癣一样的空白的情况(遇到特殊字符蔡换行)


white-space

描述
normal默认。空白会被浏览器忽略。
pre空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
pre-wrap保留空白符序列,但是正常地进行换行。
pre-line合并空白符序列,但是保留换行符。
inherit                                                                            
规定应该从父元素继承 white-space 属性的值



word-spacing

描述
normal默认。定义单词间的标准空间。
length定义单词间的固定空间。
inherit规定应该从父元素继承 word-spacing 属性的值。



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值