任何人都可以向我解释为什么当我设置lang="ar"字体系列选择 sans-serif字体时,lang="en"它选择的时候Open Sans.
<html lang="ar">
<head>
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto" rel="stylesheet">
</head>
<body style="font-family: 'Open Sans', sans-serif;">
?????? ?????
</body>
</html><html lang="en">
<head>
<link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto" rel="stylesheet">
</head>
<body style="font-family: 'Open Sans', sans-serif;">
?????? ?????
</body>
</html>Nie*_*sol 11
并非所有字体都包含所有字符.最有可能的是,Open Sans不包含该语言的正确字符,因此浏览器将按顺序排列到下一个字体,依此类推,直到查找可能具有您需要的字符的系统字体.最后,如果所有其他方法都失败了,你会得到"豆腐",通常是一个空盒子,一个带有X的盒子,或一个包含该角色十六进制代码的盒子.
您可以在官方W3C CSS Fonts Module Level 3规范中找到更多信息:https://www.w3.org/TR/css-fonts-3/#font-matching-algorithm.
发生的事情是Open Sans不支持阿拉伯字符.因此,在两个片段中,Open Sans根本没有被应用,浏览器直接进入后备字体.
两个代码段中字体看起来不同的原因是因为在您的第一个代码段中,浏览器因为lang标记而知道该语言是阿拉伯语.它要求系统为阿拉伯语提供最佳的sans-serif后备字体,在Mac上这是Geeza Pro Regular.
在您的第二个片段中,浏览器认为该语言是英语,并要求提供最佳的英语sans-serif后备字体.在Mac上,这是Arial.
Geeza Pro和Arial显然都支持阿拉伯语文本,但根据实际语言,系统会选择其中一种.