不能讓Bebas Neue自定義字體工作

我想讓Bebas Neue字體工作，我已經設法將我的字體轉換爲它們各自的類型，但每當我在瀏覽器中加載字體時，我都會得到錯誤。不能讓Bebas Neue自定義字體工作

螢火蟲拋出：

下載字體：下載失敗

鉻拋出沒有找到404。

我最初有這些在他們自己的字體文件夾，但我決定將字體移動到我用來試圖排除位置問題的樣式表的相同目錄。

這個特定的文件是一個名爲_typography的SASS部分，它位於一個名爲global的文件夾中，這是同一個文件夾，我直接將所有字體放入原樣。

@font-face { 
    font-family: 'BebasNeueRegular'; 
    src: url(BebasNeueRegular.eot); 
    src: url(BebasNeueRegular.eot?#iefix) format('embedded-opentype'), 
     url(BebasNeueRegular.woff) format('woff'), 
     url(BebasNeueRegular.ttf) format('truetype'), 
     url(BebasNeueRegular.svg) format('svg'); 

    font-weight: normal; 
    font-style: normal; 
}

來源

2017-01-16 Lewis Briffa

技術說明：使用WOFF/WOFF2，不要使用任何其他格式 - 它們在過去是必需的，但現在已經不是必需的。有關更多詳細信息，請參閱http://stackoverflow.com/a/37091681/740553。 –

確保您@font-face您font-family搭配使用CSS的，或者：

font-family: 'Bebas Neue';上的一切或：
font-family: 'BebasNeueRegular';上的一切。

像：

@font-face { 
    font-family: 'BebasNeueRegular'; 
    src: url(BebasNeueRegular.eot); 
    src: url(BebasNeueRegular.eot?#iefix) format('embedded-opentype'), 
     url(BebasNeueRegular.woff) format('woff'), 
     url(BebasNeueRegular.ttf) format('truetype'), 
     url(BebasNeueRegular.svg) format('svg'); 

    font-weight: normal; 
    font-style: normal; 
}

匹配CSS使用：

.selector { 
    font-family: 'BebasNeueRegular', sans-serif; 
}

或者：

@font-face { 
     font-family: 'Bebas Neue'; 
     src: url(BebasNeueRegular.eot); 
     src: url(BebasNeueRegular.eot?#iefix) format('embedded-opentype'), 
      url(BebasNeueRegular.woff) format('woff'), 
      url(BebasNeueRegular.ttf) format('truetype'), 
      url(BebasNeueRegular.svg) format('svg'); 

     font-weight: normal; 
     font-style: normal; 
    }

匹配：

.selector { 
    font-family: 'Bebas Neue', sans-serif; 
}

來源

2017-01-16 15:02:16 Syden

出現404錯誤 - 98％的錯誤是因爲路徑錯誤。

只是一個想法 - 你提到你將他們移動到SASS部分？該文件夾可以從網站訪問嗎？根據我的經驗，你的SASS將被編譯成某種public目錄。

爲了排除故障......理論上，您應該可以添加www.yourdomaincom/path-to-font/font.eot並提供一個下載文件。

如果你不是，那麼它確實是一個錯誤所在的路徑問題。至於爲什麼其他字體正在工作，如果沒有更好地瞭解您的項目設置方式，我就無法說出來。

只是我的兩美分值得幫助您排除故障！

來源

2017-01-16 15:58:37

更明確地說：css字體聲明中url的路徑需要匹配*，如從該css文件*的位置看到的那樣。 – kontur

不能讓Bebas Neue自定義字體工作

回答

相關問題