Question

我正在尝试使用字体在本地加载google字体，并成功完成了此任务。代码：

<style>
    /* roboto-300 - latin */

    @font-face {
      font-family: 'Roboto';
      font-style: normal;
      font-weight: 300;
      src: url('src/common/fonts/roboto-v18-latin-300.eot');
      /* IE9 Compat Modes */
      src: local('Roboto Light'), local('Roboto-Light'),
      url('src/common/fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
      url('src/common/fonts/roboto-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
      url('src/common/fonts/roboto-v18-latin-300.woff') format('woff'), /* Modern Browsers */
      url('src/common/fonts/roboto-v18-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
      url('src/common/fonts/roboto-v18-latin-300.svg#Roboto') format('svg');
      /* Legacy iOS */
    }
  </style>

但是，在上述声明之后的组件中，我也有调用去google的cdn来检索字体。

<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto+Mono:400,700|Roboto:400,300,300italic,400italic,500,500italic,700,700italic" crossorigin="anonymous">

由于这个原因，我本地保留的字体将被忽略，并且在调用cdn的地方也会选择所需的字体（例如https://fonts.gstatic.com/s/roboto/v18/KFOlCnqEu92Fr1MmSU5fBBc4.woff2）。如果在此行中添加注释，则会从我的目标以font-face形式选择字体。

根据我的理解，由于我的声明位于此链接之前，因此应从提到的src中提取字体。

我想念什么吗？这不是字体应该工作的方式吗？

由于我的字体样式在https调用之前，因此应该加载
加载它们时，也不应进行对Google cdn的后续调用（实际上是获取所需字体的调用）（https://fonts.gstatic.com/s/roboto/v18/KFOlCnqEu92Fr1MmSU5fBBc4.woff2）

注意：外部呼叫存在于第三方组件中，因此我无法在生产中将其注释掉。

字体：外部网站优先？

0 个答案: