css - 什么是系统字体堆栈？

Question

许多流行的网站（包括 Stack Overflow、GitHub、Medium 和 Wordpress）都采用了系统字体堆栈的使用。

1. 什么是系统字体堆栈？
2. 为什么要使用系统字体堆栈？
3. 系统字体堆栈应该是什么样的？
   

有许多不同的站点具有不同版本的系统字体堆栈，但不清楚哪一个是最新的并且与现代设备最兼容：

• systemfontstack.com
• CSS 技巧：系统字体堆栈

相关问题：

• 在“系统字体堆栈”中指定“Roboto”实际上有什么作用吗？
• 如何指定系统默认的 serif 和 sans-serif font-family？

标签： cssfonts

Answer 1

什么是系统字体堆栈？

CSSfont-family属性接受一个字体列表并使用浏览器可用的第一个字体。

一个（不是）系统字体堆栈是一个字体列表，它们是：

• 可能安装在许多计算机上（目标是在可能查看网站的每台计算机上至少有一种字体可用）
• 外观相似，因此设计一致（例如相似的字母宽度等）

正如我所说，这是一个“a”而不是“the”的问题。类似于 Ariel 的系统字体列表将不同于类似于 Times New Roman 的系统字体列表。

为什么要使用系统字体堆栈？

在不同设备上获得一致的外观，而无需从 Internet 加载字体文件的带宽或时间问题。

系统字体堆栈应该是什么样的？

这是一个见仁见智的问题。

虽然它得到了科学的支持（人们对跨设备字体的可用性进行了研究），但您想要使用和决定哪些字体足够相似以满足您的目的并不是一成不变的。