css – 是否可以为Google字体指定自定义名称？

这是一个示例CSS

h1 {
   font-family: 'header-font',arial,sans-serif;
}

p {
   font-family: 'paragraph-font',serif;
}

是否可以加载任何远程Google字体(比如’Lato’),以便CSS中的系列名称为’header-font’？

编辑：这背后的想法是能够轻松交换WP主题中的字体.不幸的是,在我的情况下,在CSS预处理器中使用变量不是一个选项.

最佳答案

是的,您可以在@ font-face样式声明中定义字体系列时提供所需的任何名称,并使用该名称稍后在样式表中引用它.

@font-face
{
  font-family: whateverYouWant;
  src: url('example.ttf'),url('example.eot');
       ... /* and so on */
}

无论你在font-family属性中命名的样式是什么,它将如何从文档的其余部分引用.但是我不知道它如何与本地字体文件竞争(所以如果你试图命名一个自定义字体Arial我不知道你会得到什么 – 自定义字体或真正的Arial).我不知道为什么你会这样做.