@import 字体 VS HTML 外部链接 CSS

Question

我有一个网站使用来自 Google CDN 的两种字体。

第一个是从主 CSS 文件开头的 Google CDN @imported，如下所示：

// Start of file
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,300italic,400italic,700,700italic,900,900italic);

html, body { height: 100%, width: 100%:
// rest of file

第二种字体直接从 Google CDN 链接到 HTML，如下所示：

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Raleway:300,400,500,700,600" />

任何人都可以解释每种方法对性能的影响以及为什么会选择其中一种方法吗？

Answer 1

一般答案在这里；简而言之，don't use import.

@import 字体 VS HTML 外部链接 CSS

@import font VS HTML links for external CSS

css

fonts

cdn

google-cdn