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';
}

另外，您正在使用字體文件的相對路徑，請檢查它們是否正確！