浏览器如何处理 "Tofu" 个字符
How do browsers deal with "Tofu" characters
字符。我在我正在创建的混合 Cordova/Android 应用程序中使用 Orbitron font - 很简单，因为它紧凑并且具有我所追求的干净，未来主义的外观。然而，不久前我意识到 Orbitron 是一种相当有限的字体，只支持基本的拉丁字符集。
我正要开始切换到由 Google 创建的 Noto * 字体系列，所以 No more Tofu - tofu beign排字员用来描述当字体没有合适的字形来显示时出现的空白矩形框的术语。
在我的应用程序中加入 Noto Sans、Noto Sans Naksh（阿拉伯语）和 Noto Sans CJK（远东）字体系列会增加它的大小，所以我决定先在 Chrome 上做一个实验Windows（一段时间以来，Android 在其混合应用程序中使用的 WebView 来自 Chrome，因此测试具有相当的代表性。
我的测试标记如下所示。即使 Orbitron 被指定为默认 important 字体 Chrome 也能很好地用西班牙语显示 "Hello World!" 的文本（Orbitron 没有倒转的西班牙语感叹号）、阿拉伯语、简体中文、日语和泰米尔语（Orbitron 中均不存在）。
*{font-family:orbitron !important;}
<link href="https://fonts.googleapis.com/css?family=Orbitron&display=swap" rel="stylesheet">
<div id='english'>Hellá</div>
<div id='spanish'>¡Hola Mundo!</div>
<div id='arabic'>مرحبا بالعالم!</div>
<div id='sch'>你好，世界！</div>
<div id='jp'>こんにちは世界！</div>
<div id='tamil'>வணக்கம் உலகம்!</div>
很明显，Chrome 在 Orbitron 中找到 Tofu 时，在这里悄悄地使用了可靠的回退。我的问题
- 这种豆腐替代是如何发生的？
- 依靠自动 Tofu 替换是否可以，还是建议使用一些明智的 CSS 和精心选择的字体系列来处理特定于语言的问题？
在 Chrome 中，您可以检查元素，然后切换到 "Computed" 选项卡，它将显示渲染字体。 Chrome（我认为大多数现代浏览器）将为所有受支持的字符使用该字体，并将静默使用本地字体来显示其余字符。
例如对于日语，它将使用 "Yu Gothic" 表示 5 个字形，"SimSun" 表示 3 个字形。
对于泰米尔语，它使用 "Orbitron" 中的 2 个字形（space 和感叹号），其余 12 个在 "Nirmala UI" 中呈现：
对于西班牙语，它只呈现 "Orbitron"，我不确定为什么，但我猜它基本上使用现有的感叹号并旋转它。
使用哪个本地字体文件可能因浏览器和 OS 而异。
字符。我在我正在创建的混合 Cordova/Android 应用程序中使用 Orbitron font - 很简单，因为它紧凑并且具有我所追求的干净，未来主义的外观。然而，不久前我意识到 Orbitron 是一种相当有限的字体，只支持基本的拉丁字符集。
我正要开始切换到由 Google 创建的 Noto * 字体系列，所以 No more Tofu - tofu beign排字员用来描述当字体没有合适的字形来显示时出现的空白矩形框的术语。
在我的应用程序中加入 Noto Sans、Noto Sans Naksh（阿拉伯语）和 Noto Sans CJK（远东）字体系列会增加它的大小，所以我决定先在 Chrome 上做一个实验Windows（一段时间以来，Android 在其混合应用程序中使用的 WebView 来自 Chrome，因此测试具有相当的代表性。
我的测试标记如下所示。即使 Orbitron 被指定为默认 important 字体 Chrome 也能很好地用西班牙语显示 "Hello World!" 的文本（Orbitron 没有倒转的西班牙语感叹号）、阿拉伯语、简体中文、日语和泰米尔语（Orbitron 中均不存在）。
*{font-family:orbitron !important;}
<link href="https://fonts.googleapis.com/css?family=Orbitron&display=swap" rel="stylesheet">
<div id='english'>Hellá</div>
<div id='spanish'>¡Hola Mundo!</div>
<div id='arabic'>مرحبا بالعالم!</div>
<div id='sch'>你好，世界！</div>
<div id='jp'>こんにちは世界！</div>
<div id='tamil'>வணக்கம் உலகம்!</div>
很明显，Chrome 在 Orbitron 中找到 Tofu 时，在这里悄悄地使用了可靠的回退。我的问题
- 这种豆腐替代是如何发生的？
- 依靠自动 Tofu 替换是否可以，还是建议使用一些明智的 CSS 和精心选择的字体系列来处理特定于语言的问题？
在 Chrome 中，您可以检查元素，然后切换到 "Computed" 选项卡，它将显示渲染字体。 Chrome（我认为大多数现代浏览器）将为所有受支持的字符使用该字体，并将静默使用本地字体来显示其余字符。
例如对于日语，它将使用 "Yu Gothic" 表示 5 个字形，"SimSun" 表示 3 个字形。
对于泰米尔语，它使用 "Orbitron" 中的 2 个字形（space 和感叹号），其余 12 个在 "Nirmala UI" 中呈现：
对于西班牙语，它只呈现 "Orbitron"，我不确定为什么，但我猜它基本上使用现有的感叹号并旋转它。
使用哪个本地字体文件可能因浏览器和 OS 而异。