by zhangxinxu from https://www.zhangxinxu.com/wordpress/?p=9870 本文欢迎分享与聚合，全文转载就不必了，尊重版权，圈子就这么大，若急用可以联系授权。

中文中，有些标点是避首标点，也就是不能出现在一行的开头，例如句号。，有些标点是避尾标点，例如上引号“，上书名号《等。

因此，我们经常会看到如下所示的排版，就是明明后面空间足够放一个文字，但是这个文字却跑到了下一行。

如下图所示：

原因就在于如果“话”在上一行显示，那么句号就会显示在下一行的开头，而句号。是避首标点，必能出现在开头。因此，“话”字就被带到下一行显示了。

中文标点的这种换行特性，即使设置word-break:break-all也是无效的，此时需要用到的CSS属性是line-break。

//zxx: 如果你看到这段文字，说明你现在访问是体验糟糕的垃圾盗版网站，你可以访问原文获得很好的体验：https://www.zhangxinxu.com/wordpress/?p=9870（作者张鑫旭）

line-break属性主要用在CJK语言中，也就是中日韩3种语言中，其中以中文和日文为主。

语法如下：

其中：

以下是和中文有关的几个规则：

例如下图所示的效果，strict模式下，字符〜的前方必须有文字，不能作为换行点。

但是，相对的，strict模式下，字符〜的后方可以作为换行点，而normal和loose不行，如下图所示：

・ U+30FB, ： U+FF1A, ； U+FF1B, ･ U+FF65, ‼ U+203C, ⁇ U+2047, ⁈ U+2048, ⁉ U+2049, ！ U+FF01, ？ U+FF1F

则属性值是loose的时候，上面这些标签的前方可以作为换行点，其他属性值（除非anywhere）都禁止。

例如下图所示的对比效果：

以上规则对应的效果均可以实地体验，您可以狠狠地点击这里：line-break与中文排版换行体验demo

操作上方的滑杆，就可以看到不同尺寸下，各类中文标点在不同的line-break属性值下的换行表现了。

line-break虽然平常用的少，不太常见，但实际上是一个相对比较古老的CSS属性，目前几乎所有浏览器都支持。

完整的兼容性如下截图所示：

属性虽不常见，但是关键时候顶用，脑中存个档，需要的时候能够记起来就可以了。

今天是春节假期最后一天，应该说是我们公司假期最后一天，阅文和腾讯一样，春节前后比法定假日多放一天。

春节假期开始到现在，写了12篇文章（包括本文），还有一篇待写。

很多春节计划都没完成。

例如以前写的小说重新梳理调整下，Github登录API调整，《CSS新世界》书稿review。

待会儿去看场电影，估计2个小时，然后把最后一篇文章写完，应该3小时左右。然后review书稿，这个工作可能要一周，由于延期，需要和编辑说下。

事儿多，忙不完。

今年又会是忙碌不止的1年。

本文为原创文章，欢迎分享，勿全文转载，如果实在喜欢，可收藏，永不过期，且会及时更新知识点及修正错误，阅读体验也更好。 本文地址：https://www.zhangxinxu.com/wordpress/?p=9870

（本篇完）