Question

问题：有没有一种正确的方法来设置页面语言，以便在使用Unicode字符时不会引起大量样式退化？还是有一个简单的解决方法，不涉及在我们的CSS中散布一堆:lang伪选择器，这是一个非常低效的解决方案？我有其他吸引人的想法：停止使用Unicode字符，改用图标。在我们庞大而成熟的代码库中，这并非易事。

更新：这是一个新的可运行示例。似乎只有一些Unicode字符会出现此问题，并且只有某些字体会出现此问题。

body {
  font-family: serif;
}

<h3>Blackjack advice (Unicode dabblings)</h3>

<p lang="en-US">If you draw ♤, alway hit</p>
<p lang="zh-Hans">如果你画 ♤，总是打</p>

<p lang="en-US">If you draw ●, alway hit</p>
<p lang="zh-Hans">如果你画 ●，总是打</p>

<p lang="en-US">If you draw ❦, alway hit</p>
<p lang="zh-Hans">如果你画 ❦，总是打</p>


<p lang="en-US">If you draw ?, alway hit</p>
<p lang="zh-Hans">如果你画 ?，总是打</p>

Why is ● so large in Chinese? Interestingly, changing font-family to sans-serif normalizes the size (at least in my current context, Chrome/Windows).

Answer 1

来自specification：

用户代理可以使用元素的语言来确定适当的处理或呈现方式（例如，在选择适当的字体或发音时，用于词典选择或用于表单控件（例如日期选择器）的用户界面）。

您要求获得一种适合渲染简体中文的字体，而浏览器/ OS确实需要这种字体，而且这种字体（至少在您的系统上）具有样式不同的●字形。 / p>

我建议将您感兴趣的符号包装在一个单独的标签中，使用它覆盖字体以使其最适合（也许是CSS字体，以便更好地控制大小/样式），并且也可以将其用作一次绝佳的机会给他们一些替代文字/标题，因为就我个人而言，我已经不知道圆圈是棍棒还是菱形，因为在我的任何解释中，音符都不像这两种西装中的任何一种我知道。

body {
  font-family: serif;
}
abbr.ico {
  font-family: sans-serif;
}

<h3>Blackjack advice (Unicode dabblings)</h3>

<p lang="en-US">If you draw ●, alway hit</p>
<p lang="ru-RU">Если вам попался ●, ходите</p>
<p lang="zh-Hans">If you draw ●, alway hit</p>
<p lang="zh-Hans">如果你画 ●，总是打
<br>If you draw ●, alway hit</p>
<p lang="en-US">If you draw <abbr class="ico" title="a circle?">●</abbr>, alway hit</p>
<p lang="zh-Hans">如果你画 <abbr class="ico" title="a circle?">●</abbr>，总是打</p>

设置元素的语言属性会导致子代中的Unicode字符错误

1 个答案: