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

Jack J
Jack J

CSS 文本模块级别 4 中将新增四项国际 CSS 功能,供您在 Chrome 中使用。此帖介绍了已发货和即将发货。

  • 从 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 用于在自然语句边界处换行。

边界检测由机器学习引擎执行,因此不一定能达到您的预期。如果出现这种情况,您可以手动调整可破坏的点。<wbr> 标记或零宽空格 (&ZeroWidthSpace;) 会强制使用断点,而零宽联接符 (&zwj;) 则会防止中断。

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

目前,Chrome 仅支持日语此功能,该功能使用采用 AdaBoost ML 技术的 BudouX C++ 端口。有关详情,请参阅 Google Developers 日本分部:BudouX: 読みんすい改行のたいの軽量な分いくたい起始器

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

脚本间间距:text-autospace

以下功能目前在 Chrome 中位于一个标记之后。如需对其进行测试,请在 Chrome 120 或更高版本中启用实验性 Web 平台功能标志(可在 chrome://flags/#enable-experimental-web-platform-features 中找到)。

中文和日语混用多种文字形式,包括汉字、拉丁文和 ASCII 数字,以及平假名和片假名(在日语中)。在切换和切换非汉字汉字时,使用较小的空格通常有助于提高可读性。

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

<ph type="x-smartling-placeholder">
</ph> 新的默认行会应用小间距,以提高可读性,这可以通过 text-autospace 进行控制。 <ph type="x-smartling-placeholder">
</ph> 新的默认值会应用小间距,以提高可读性,这可以通过 text-autospace 进行控制。

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

text-autospace: no-autospace;

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

以下功能正在开发中,旨在默认在 Chrome 中启用。

在中文、日语和韩语中,标点字符之间的字距调整可提高可读性,并产生更美观的排版。目前,大多数印刷材料和文字处理程序都采用这种字距调整。

例如,CJK 句点和 CJK 右括号通常在字形空格的右半部分有字形内部间距,以便每个字符可以不断推进。

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

<ph type="x-smartling-placeholder">
</ph> 当连续显示标点符号时,应移除中日韩英文句点的右半部分。 <ph type="x-smartling-placeholder">
</ph> 当连续显示标点符号时,应移除中日韩英文句点的右半部分。

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

不同语言的最小字体大小一致

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

从 Chrome 118 开始,我们已针对所有语言取消了此限制,确保这 7 种语言与其他语言基本一致。此变更可改善与其他浏览器的互操作性。

<ph type="x-smartling-placeholder">
</ph> 从 Chrome 118 开始,对于阿拉伯语、波斯语、日语、韩语、泰语、简体中文或繁体中文,不得按指定方式呈现小于 10px 左右的字体大小限制。 <ph type="x-smartling-placeholder">
</ph> 从 Chrome 118 开始,对于阿拉伯语、波斯语、日语、韩语、泰语、简体中文或繁体中文,不得按指定方式呈现小于 10px 左右的字体大小限制。

互动和分享反馈

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