html换行(文本+符号)

这是笔者在做评论模块时发现的一个问题,记录一下。
通常笔者在做换行处理时,都是使用word-break:break-all;word-wrap: break-word;可是这次出现了一点问题,如下图。
html换行(文本+符号)_第1张图片
可以发现,多个感叹号连在一起则无法换行。原来笔者也没发现过这个问题,所以也有点懵。不过有问题了,我们还是得去解决的。不过笔者逛了一圈百度,貌似都没有提及到这个问题的解决方法,只能靠自己了。在查阅了一轮资料后,发现:

normal 使用浏览器默认的换行规则。
break-all 允许在单词内换行。
keep-all 只能在半角空格或连字符处换行。

于是更改为word-break:keep-all;word-wrap: break-word;问题解决。
html换行(文本+符号)_第2张图片

你可能感兴趣的:(html换行(文本+符号))