@ font-face不工作3

Question

我想在測試頁上使用ttf字體，我已將它轉換爲woff和woff2，但瀏覽器不使用該字體（我試過用Opera， Chrome，Vivaldi，Firefox和Edge）。這是我的代碼：

@font-face { 
font-family: 'RM Typerighter old Regular'; 
src: url('/fonts/RM_Typerighter_old_Regular.woff2') format('woff2'); 
src: url('/fonts/RM_Typerighter_old_Regular.woff') format('woff'); 
src: url('/fonts/RM_Typerighter_old_Regular.ttf') format('truetype'); 
} 

Answer 1

這可能是因爲您沒有使用相對路徑試試這個：

@font-face { 
    font-family: 'RM Typerighter old Regular'; 
    src: url('./fonts/RM_Typerighter_old_Regular.woff2') format('woff2'), 
     url('./fonts/RM_Typerighter_old_Regular.woff') format('woff'), 
     url('./fonts/RM_Typerighter_old_Regular.ttf') format('truetype'); 
} 

Answer 2

您需要將您的所有字體文件的一個src和用逗號分隔如下：

@font-face { 
    font-family: "RM Typerighter old Regular"; 
    src: url("/fonts/RM_Typerighter_old_Regular.eot?") format("eot"), 
     url("/fonts/RM_Typerighter_old_Regular.woff") format("woff"), 
     url("/fonts/RM_Typerighter_old_Regular.ttf") format("truetype"); 
}