css - 字体总是由浏览器加载吗？

Question

@import url(http://fonts.googleapis.com/css?family=Droid+Sans);


.hi{
  font-family: "Droid Sans", sans-serif;
}

即使当前页面中没有 .hi 类的元素，浏览器是否加载字体？我知道它不适用于背景图片。

Answer 1

John Conde 的回答是正确的，但您可能需要注意一些细节。

1. 说到 @font-face 他是对的，它只会被下载 如果有一个 html 元素满足使用该字体的 css 规则 .之所以如此，是因为 css 属性只会在元素遇到选择器时立即执行。

2. 但是你没有使用@font-face，你使用的是@import，所以要小心。 @import 无论如何都会执行。它链接到 css 文件并将被下载。

3. 但是，在您的情况下，您是从 google 字体下载的，因此生成的导入将是一个 @font-face 声明。这导致了第一个声明。

结论:

换句话说，在您的特定示例中，将执行导入。您将向 Google 的服务器请求它的 @font-face 声明。但是 在您真正将 css 规则应用于 Html 元素之前，不会下载实际的字体文件(.ttf、.woff)。