Google字体名称中带有空格，用HTML引用的正确方法是什么？

Question

这是我从google字体网页上的链接复制的字体。其他字体（muli，oswald，lato）可以正常工作，但是当我尝试使用它时，不会显示sawarabi mincho，当我想使用sawarabi mincho时，chrome似乎使用了我的默认字体。

我尝试了

p{
    font-family: Sawarabi_Mincho;
}
p{
    font-family: Sawarabi+Mincho;
}
p{
    font-family: Sawarabi Mincho;
}
p{
    font-family: "sawarabi+mincho";
}

但是这些似乎都不起作用。

调用名称中带有空格的字体的正确方法是什么？

Answer 1

Google Fonts告诉您是否单击字体的“ +”，然后单击“ 1个选定的族”以显示工具窗口：

  

在CSS中指定

     

使用以下CSS规则指定这些族：

     

font-family: 'Sawarabi Mincho', sans-serif;

     

有关如何将字体添加到网页的示例，请参见getting started guide。

所以这应该起作用：

body {
  font-family: 'Sawarabi Mincho', sans-serif;
}

<!-- head: -->
<link href="https://fonts.googleapis.com/css?family=Sawarabi+Mincho" rel="stylesheet">

<!-- body: -->
<h1>A red flare silhouetted the jagged edge of a wing.</h1>