解释CSS结构

Question

我在其中一个网站上找到了这段代码。显然，CSS样式定义了字体系列。但我无法得到这种结构。请帮帮我。提前致谢。

font-family: "Open Sans",Helvetica,Arial,sans-serif;

Answer 1

首先加载 Open Sans 字体，如果不可用，请加载 Helvetica ，如果 Helvetica 不可用，请加载 Arial ，并且，如果它们都不可用，则加载另一个 sans-serif 字体。

<强> Docs:

属性值是字体系列名称和/或通用系列名称的优先级列表。与大多数其他CSS属性不同，组件值由逗号分隔，表示它们是备选方案：

body { font-family: Gill, Helvetica, sans-serif }

有两种类型的字体系列名称：

<family-name>

所选字体系列的名称。在最后一个例子中，“Gill”和“Helvetica”是字体系列。

<generic-family>

在上面的示例中，最后一个值是通用系列名称。定义了以下通用族：

    'serif' (e.g., Times)
    'sans-serif' (e.g., Helvetica)
    'cursive' (e.g., Zapf-Chancery)
    'fantasy' (e.g., Western)
    'monospace' (e.g., Courier)

Answer 2

浏览器会尝试使用列表中的第一个字体，如果没有安装，它将转到列表中的下一个字体，依此类推。