Question

我正在尝试使用@import导入字体样式表（由FontSquirrrel webkit Generator生成）。

适用于：

<style type="text/css">
       @import url(Proxima/stylesheet.css); /*local*/
        a{margin:0;padding:0;border:none;}  

  @media screen {
    .webfont {
       font-family: 'proxima_nova_rgregular', arial, sans-serif !important;
    }
      .webfont1 {
       font-family: 'proxima_nova_ltlight', arial, sans-serif !important;
    }
  }
</style>

不能使用：

<style type="text/css">
       @import url(https://0bf0007020cb4f97394dbf39c4e66e8f9ffcebff.googledrive.com/host/0B5Ymj7It1uz4SkUyZ3hpRVV0Nlk); /*Remote*/
        a{margin:0;padding:0;border:none;}  

  @media screen {
    .webfont {
       font-family: 'proxima_nova_rgregular', arial, sans-serif !important;
    }
      .webfont1 {
       font-family: 'proxima_nova_ltlight', arial, sans-serif !important;
    }
  }
</style>

更新

正如@Vinky建议绕过@import并将CSS放入HTML中的想法：这里是JSFiddle

P.S：
@import用于网页顶部。

由于兼容性问题，无法使用<link>代码，因为它将是电子邮件签名。

Answer 1

您的电子邮件客户端可能只会阻止外部资源 - 也可能阻止其他人的客户端。从电子邮件中引用外部资源并不是一个好主意。

使用cid img src。

引用的内联css样式和内嵌图像

Answer 2

如果你想将它用作电子邮件签名，我建议你直接在你的html中包含CSS，而不是引用它。

它将避免不必要的HTTP请求，并且比邮件客户端中的@import得到更广泛的支持。

然后可以修改包含的FontSquirrel CSS以加载远程字体。

适用于“本地URL”的@import不适用于“远程URL”

2 个答案: