汉字的辅助字体

【问题标题】：Secondary fonts for Chinese characters汉字的辅助字体
【发布时间】：2013-05-27 23:26:51
【问题描述】：

有没有办法在 CSS 中为汉字指定不同的字体？

具体来说，我有一些用户输入的文本，其中可以包含标准英文、汉文字符或两者的混合。我想对非汉字符使用 Myriad Pro，对所有汉字符使用 Kaiti Std。

我意识到这可以通过使用 JavaScript 运行内容，在汉字周围添加 span 标签，然后对其应用样式来完成，但有没有更标准/更有效的方法？

我不关心旧浏览器，尽管它应该可以在最新版本的 Chrome/Firefox/Safari/IE 中运行。

【问题讨论】：

标签： css localization internationalization

【解决方案1】：

您可以为 font-faces 指定 unicode-range，以便每种字体仅适用于 unicode 字符的子集。

http://dev.w3.org/csswg/css-fonts/#composite-fonts

一个非常基本的实现看起来像（根据需要调整字体文件和格式）：

@font-face {
    font-family: 'MyFonts';
    src: local('Kaiti Std');
    unicode-range: U+4E00-9FFF;
}

@font-face {
    font-family: 'MyFonts';
    src: local('Myriad Pro');
}

body {
    font-family: 'MyFonts', sans-serif;
}

http://24ways.org/2011/creating-custom-font-stacks-with-unicode-range/ 记录了一些有趣的浏览器怪癖/解决方法

【讨论】：