Question

我在我的项目中使用 foundation.min.css 。每次我在HTML文件中加载上述内容时，我的浏览器都会尝试在线获取字体。但奇怪的是，即使没有互联网接入它也能正常工作。

我需要知道：

如何禁用基础在线提取字体？
为什么即使加载功能也没有变化？

如何编辑此项以删除在线提取功能而不会损害原始文件？ foundation.min.css代码：

@import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");

HTML code：

<!doctype html>
<html ng-app ng-csp>
  <head>
    <link href="styles/foundation.min.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="libs/angular.min.js"></script>
    <script type="text/javascript" src="main.js"></script>
  <style>
    body {
      padding: 10px;
      overflow: auto;
    }
  </style>
  </head>
<body>

<div>
        <div>
        <h3>Sample Application</h3>
        <input type="text" ng-model="name" placeholder="Your text here..">
        <h1>{{name}}</h1>
    </div>
<button>Submit</button>
<table>
    <tr><th>Name</th><th>Age as on 1/1/2014</th></tr>
    <tr><td>Sourabh Sharma</td><td>21</td></tr>
    <tr><td>Shourya Sharma</td><td>23</td></tr>
    <tr><td>Vinay Kumar</td><td>18</td></tr>
</table>
</div>


</body>
</html>

Answer 1

如何禁用基础在线提取字体？

从foundation.min.css中移除以下代码（您已在上面提到）

@import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");

为什么即使加载了功能也没有变化？

因为它描述了本地所需的css

Answer 2

离线时，如果您的计算机上有字体，则删除网络字体导入不会阻止显示字体。只有当没有安装字体的人查看时，它才会阻止字体显示。

如果您在某个时候计划使用这些字体，请单独留下@import，只需添加一个可以轻松打开和关闭的覆盖。

body { font-family:arial,sans-serif !important; }

如果您只想影响特定字体而不是整个文档，那么只需在编辑器中搜索并替换您要替换的font-family声明。

CSS从互联网上加载字体

2 个答案: