使用Google Fonts导入Verdana/Tahoma时请求失败（ERR_ABORTED）求助

为什么包含Verdana/Tahoma会请求失败？ #

Google Fonts的服务只提供它官方托管的开源字体，而Verdana和Tahoma是微软开发的商业系统字体，并不在Google Fonts的托管列表里。当你把这两个字体加入@import的URL参数时，Google的API无法识别这些字体，会直接返回错误，导致请求被中止（也就是你看到的net::ERR_ABORTED）。

具体解决步骤 #

1. 拆分字体加载逻辑
   只通过Google Fonts加载它托管的字体（比如你的例子里的Open Sans、Abhaya Libre），系统预装字体不需要通过外部请求加载，直接在font-family中声明即可。

   错误写法：

   @import url(https://fonts.googleapis.com/css?family=Open+Sans|Abhaya+Libre|Tahoma);
   

   正确写法：

   /* 只加载Google托管的字体 */
   @import url(https://fonts.googleapis.com/css?family=Open+Sans|Abhaya+Libre);
   
   /* 在字体栈中加入系统字体作为降级选项 */
   body {
     font-family: 'Open Sans', 'Abhaya Libre', Tahoma, Verdana, sans-serif;
   }
   

2. 推荐使用link标签替代@import
   Google Fonts官方更推荐用<link>标签在HTML头部加载字体，性能比@import更好，也更不容易出错：

   <link href="https://fonts.googleapis.com/css?family=Open+Sans|Abhaya+Libre" rel="stylesheet">
   

3. 利用Google Fonts官方工具生成代码
   直接访问Google Fonts官方平台搜索你需要的字体（比如Open Sans、Abhaya Libre），然后点击"Embed"按钮，它会自动生成正确的加载代码，避免手动输入URL时出错。

补充说明 #

系统字体（如Tahoma、Verdana、Arial等）是用户系统中已经预装的字体，不需要额外请求，直接放在font-family的后面作为降级选项，可以保证在Google字体加载失败或用户网络不佳时，页面依然能显示合适的字体。

内容的提问来源于stack exchange，提问作者Andy