CSS 中推出四项新的国际功能

Jack J
Jack J

Chrome 即将推出 CSS 文本模块级别 4 中的四项新国际 CSS 功能。本文将介绍已发布的功能以及即将推出的功能。

  • 从 Chrome 119 开始:日语短语会使用 word-break: auto-phrase 进行换行。
  • 在 Chrome 120 中通过标志启用:使用 text-autospace 属性实现脚本间间距。
  • 正在开发中:使用 text-spacing-trim 属性调整中文、日语和韩语 (CJK) 标点符号的间距。
  • 不同语言采用一致的最小字体大小。

日语词组换行:word-break: auto-phrase

此功能可提高日语文本的可读性,从 Chrome 119 开始提供

某些东亚语言(如中文或日语)不使用空格来分隔字词,并且行可以在任何字符处换行,即使字词中间也是如此。这是这些语言的正常换行行为,但在标题或诗歌等短文本中,最好在自然短语边界处换行(在日语中,这种边界称为“文集”)。

新的 CSS 功能 word-break: auto-phrase 指定应在此类边界上进行封装。

<html lang="ja">
<style>
h1 {
  word-break: auto-phrase;
}
</style>

<h1>窓ぎわのトットちゃん<h1>
word-break: auto-phrase 会在自然词组边界处换行。
word-break: auto-phrase 用于在自然语句边界处换行。

边界检测由机器学习引擎执行,因此检测结果可能不符合您的预期。如果出现这种情况,您可以手动调整可断点。<wbr> 标记或零宽空格 (&ZeroWidthSpace;) 会强制执行断点,而零宽连接符 (&zwj;) 会阻止断点。

窓ぎわの<wbr>トットちゃん
ユーザー<wbr>インターフェース

目前,Chrome 仅支持日语版本的此功能,使用的是采用 AdaBoost 机器学习技术的 BudouX C++ 端口。有关详情,请参阅 Google Developers 日本分部:BudouX: 読のすい修改行のたいの軽量弥な分い猎郎

我们计划在未来的 Chrome 版本中支持韩语和汉语。

脚本间间距:text-autospace

以下功能目前在 Chrome 中处于标志后置状态。如需进行测试,请在 Chrome 120 或更高版本中启用实验性 Web 平台功能标志(位于 chrome://flags/#enable-experimental-web-platform-features 下)。

中文和日文混合使用多种字体,汉字、拉丁字母和 ASCII 数字,以及日语中的平假名和片假名。在从汉字转换为非汉字意象文字时,适当的间距通常有助于提高可读性。

Chrome 计划默认开始插入脚本间空格。此功能将印刷材料中广泛用于提高可读性的常见做法引入到网络中。

新默认值会应用小间距,以提高可读性,可通过 text-autospace 进行控制。
新默认设置会应用小间距,以提高可读性,可通过 text-autospace 进行控制。

若要禁止此行为,您可以使用 text-autospace 属性控制间距的插入。

text-autospace: no-autospace;

CJK 标点字符间距:text-spacing-trim

以下功能正在开发中,目标是在 Chrome 中默认启用该功能。

在中文、日语和韩语中,在标点字符之间应用字距调整可提高可读性,并产生更具视觉吸引力的排版效果。目前,大多数印刷材料和文字处理器都采用这种排版方式。

例如,中日韩句号和中日韩右括号通常设计为在字符间距的右半部分具有字符内部间距,以便每个字符都有恒定的前进量。

但是,当这些标点符号在一行中出现时,这种字形内部空格就会变得过多。在以下两个示例中,第二个示例是正确的排版;应移除 CJK 句点的右半部分。

当标点符号出现在一行中时,应移除 CJK 英文句号的右半部分。
当连续显示标点符号时,应移除 CJK 句点的右半部分。

默认行为通常能提供良好的结果,但开发者可以使用 text-spacing-trim 属性选择不同的样式,或者在某些情况下停用该属性。

各语言的字体大小下限保持一致

在 Chrome 118 之前,小于 10px 左右的字号不会按指定方式呈现,但如果语言为阿拉伯语、波斯特语、日语、韩语、泰语、简体中文或繁体中文,则会向上取整。开发者需要采用相应的解决方法来呈现小文本,例如使用 transform 属性。

从 Chrome 118 开始,所有语言都不再受此限制,这 7 种语言与其余语言一样。此项变更可提高与其他浏览器的互操作性。

从 Chrome 118 开始,对于阿拉伯语、波斯特语、日语、韩语、泰语、简体中文或繁体中文,我们取消了以下限制:字体大小小于 10 像素时无法按指定方式呈现。
从 Chrome 118 开始,对于阿拉伯语、波斯语、日语、韩语、泰语、简体中文或繁体中文,我们取消了以下限制:字体大小小于 10 像素左右时,系统不会按指定方式呈现。

互动和分享反馈

如果您对这些功能有任何反馈,请访问 crbug.com 提交问题。