CSS字体松鼠不能正确应用

Question

我使用松鼠字体中的两种字体来为某些wordpress小部件区域设置样式：Gothic和Playfair Display。 但是由于某种原因，仅应用Playfair，而忽略了哥特式。 因为它的wordpress小部件区域我实际上无法显示html，但是基本上，以下是CSS代码，该代码再次仅适用于一种字体：

CSS：

@font-face{
  font-family: 'Playdisplay';
  src: url('font/PlayfairDisplay-Bold.ttf') format('ttf'),
     url('font/PlayfairDisplay-BlackItalic.ttf') format('ttf'),
     url('font/PlayfairDisplay-BoldItalic.ttf') format('ttf'),
     url('font/PlayfairDisplay-Italic.ttf') format('ttf'),
     url('PlayfairDisplay-Regular.ttf') format('ttf'),
     url('font/PlayfairDisplay-black.ttf') format('ttf');
 font-weight: normal;
 font-style: normal;     
}
@font-face{
   font-family: 'Goth';
   src: url('font/GOTHIC.ttf') format('ttf'),
      url('font/GOTHICB.ttf') format('ttf'),
      url('font/GOTHICBI.ttf') format('ttf'),
      url('font/GOTHICI.ttf') format('ttf');
  font-weight: normal;
  font-style: normal; 
}

.mainfooter h3{
  font-family: Goth, GOTHIC; 
}

footer h1,
footer h2,
footer h3{
  font-family: Playdisplay, PlayfairDisplay-Bold;
}

如何使用两种字体并在网站的任何位置应用？

Answer 1

尝试将字体名称放在单引号中

.mainfooter h3{
  font-family: 'Goth'; 
}

footer h1,
footer h2,
footer h3{
  font-family: 'Playdisplay';
}

另外，您正在使用字体文件的相对路径，请检查它们是否正确！