Question

我正在使用asp.net mvc Intranet Web应用程序，我使用的是从网上下载的网页布局模板。在我的CSS文件中，大多数CSS文件的开头都有以下代码行（当然每个CSS都有不同的字体系列名称）： -

@import url(https://fonts.googleapis.com/css?family=Shojumaru);

我面临的问题是，如果用户访问aspnet mvc内部网并且他们无法访问互联网，这会导致浏览器继续尝试从googleapis.com下载文件10秒。

我正在尝试在我的服务器中提供这些字体，这样即使用户无法访问互联网，也会为这些文件提供服务。

有人可以建议我如何在我的asp.net mvc服务器中添加这些字体，而不是从googleapis.com检索这些文件吗？

由于

Answer 1

你可以通过 JavaScript （我建议这样做）使用WebfontLoader（与google字体相同的脚本告诉你使用）。通过它，您甚至可以通过尝试获取 Google字体获取字体的指令，如果它无法在 x 秒内获取文件，使用另一条路径（或做其他事情）。

要给出一个基本答案，您所要做的就是打开所有 googlefonts css链接，复制他们的 CSS文件和字体文件（ .svg ， .woff 。， .utf 。， .ttf 和 .eot < / em>），将所有这些文件上传到您的主机并使您的css reffer到您的localhost副本

修改
将 WebfontLoader 提升为 CSS @import 的原因

CSS位于标题中，因此必须在页面html之前加载可以显示，JavaScript如果放在HTML的末尾，就在之前关闭</body>标签最后执行

@import性能不是很明显

WebfontLoader具有在尝试加载时执行某些操作的功能一个字体（如显示另一种字体或什么都不显示）和一个如果没有找到字体，则可以执行某些操作（比如尝试从其他来源加载或调用js事件）

WebfontLoader只能加载 googlefont 的某些字符（如果您只想显示带有某种字体的页眉，则非常有用）。那你避免badwitdh问题和你的页面更快的方式

Answer 2

你可以在样式表中使用font-face

@font-face {
    font-family: 'your-font';
    src: url('../fonts/your-font.eot');
    src: url('../fonts/your-font.eot?#iefix') format('embedded-opentype'),
         url('../fonts/your-font.woff') format('woff'),
         url('../fonts/your-font.ttf') format('truetype'),
         url('../fonts/your-font.svg#your-font') format('svg');
    font-weight: normal;
    font-style: normal;

}

h1{ font-family:'your-font', Arial, Helvetica, sans-serif;}

注意： - 请在“字体”位置添加字体...

如何避免为我的CSS文件调用“fonts.googleapis.com/css?family= ..”

2 个答案: