关于浏览器不同语言的默认字体

vrgf1ew

如果页面中的元素并未指定font-family，仅设置了lang属性，或者不设置lang属性，假设该元素有多种语言的文字，那该元素会使用的字体是什么？是在哪定义的？回退机制是怎样的？和浏览器有关吗。

S8F8ry

元素未指定 font-family 属性时就继承父元素的 font-family 属性，而 lang 属性只是一种助记属性，并不会直接决定元素的内容和字体(除非有在 CSS 中使用[lang="xx"] 的选择器)，总之元素的最终字体是由其 font-family 属性决定的。

至于回退机制，主要是根据 font-family 属性值内容来确定，例如对于 font-family: Arial, Helvetica, sans-serif; 若 Arial 字体有对应文本内容的字形，则使用  Arial 字体，否则检查 Helvetica 字体，最后才回退至 sans-serif (浏览器设置中的 Sans-serif 字体)。

vrgf1ew

S8F8ry 发表于 2025-1-30 11:18
元素未指定 font-family 属性时就继承父元素的 font-family 属性，而 lang 属性只是一种助记属性，并不会直 ...

我的意思如果页面某个元素没有font-family去控制字体，也不继承，我想知道的是在没有css控制的情况下，默认字体的选择是怎样的。此时不同的lang是会影响最终渲染使用的字体的，比如lang设置为zh和jp，同一段汉字文本是会使用不同字体的默认字体的，在windows平台下常见情况是用microsoft yahei和meiryo，因为microsoft yahei和meiryo都能显示一部分中日共有的汉字。

如果不额外下载拓展，浏览器设置的字体往往只能覆盖1-2种语言，此时字体不支持的部分文本使用的字体又是由什么决定的呢。

S8F8ry

vrgf1ew 发表于 2025-1-30 11:39
我的意思如果页面某个元素没有font-family去控制字体，也不继承，我想知道的是在没有css控制的情况下，默 ...

这种情况是由系统来决定的。如果一个元素及其所有父元素均未指定 font-family 属性，那它默认使用的是浏览器的默认字体(即 chrome://settings/fonts 中的"标准字体")，若该设置的字体也不存在对应文本内容所需的字形时，则根据回退至系统语言的默认用户界面字体，例如对于简中系统则为 Microsoft YaHei UI，如果该字体中也没有其字形，则根据注册表 HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows NT\CurrentVersion\FontLink\SystemLink 中定义的字体链接再寻找替代字体，若最后也未能找到文本的字形，那就是显示成"方块"了。

vrgf1ew

S8F8ry 发表于 2025-1-31 00:19
这种情况是由系统来决定的。如果一个元素及其所有父元素均未指定 font-family 属性，那它默认使用的是浏 ...

感谢解答！能否分析下这些页面的情形，如图，箭头所指的字符有时候用的字体是黑白的segoe ui symbol，有时候又用的是彩色的segoe ui emoji，这是为什么呢？segoe ui symbol和segoe ui emoji字体都有这两个字符的，页面font-family也都是一样的。以上测试是在安全模式下进行的。我试了好几个页面，这两种情况都有。


https://en.wiktionary.org/wiki/%E2%9C%82




https://en.wiktionary.org/wiki/%E2%9C%8A

S8F8ry

vrgf1ew 发表于 2025-3-23 00:18
感谢解答！能否分析下这些页面的情形，如图，箭头所指的字符有时候用的字体是黑白的segoe ui symbol，有时 ...

对于具有变体的 emoji，即既有文本风格(显示为黑白)版本，又有表情风格(显示为彩色)版本的 emoji，如果既没有在 emoji 后使用呈现选择器(一个不可见的字符，用于指定 emoji 变体)，也没有通过 CSS 明确指定元素字体时，则此类 emoji 会采用默认风格值。这可以参考 Emoji Default Style Values，里面有对于各种情况的详细描述。

vrgf1ew

S8F8ry 发表于 2025-3-23 11:34
对于具有变体的 emoji，即既有文本风格(显示为黑白)版本，又有表情风格(显示为彩色)版本的 emoji，如果既 ...

我看了下，emoji默认显示似乎是取决于字符的Emoji_Presentation属性，yes则显示为彩色，no则显示为黑白，但有些emoji即使为no，仍然显示为彩色，这是为什么？比如✍



https://en.wiktionary.org/wiki/%E2%9C%8D



还有个问题，百分浏览器下有些字符即使加上text variation selector，还是会使用彩色的emoji。chrome则不会，和内核有关吗？

S8F8ry

vrgf1ew 发表于 2025-3-25 01:09
我看了下，emoji默认显示似乎是取决于字符的Emoji_Presentation属性，yes则显示为彩色，no则显示为黑白， ...

😂 这个默认风格值应该只能作为一种参考，具体表现是需要根据平台实现而定的，即使是同一个浏览器可能不同的内核版本之间有会有区别，例如百分和 Chrome 这样。另外我发现在 macOS 中 Chrome 和 Safiri 对于 text+ts 列的表情处理更为离谱：