@ font-family rails中的CSS規範，不顯示正確的字體

Question

我目前所擁有的是以下路徑中的字體文件夾：app/assets/fonts。

存儲各種@ font-face，'font-format-files'（eot，woff，ttf）。另外，我有一個mystyle.scss.erb文件用下面的代碼：

@font-face { 
    font-family: 'ProximaNovaRegular'; 
    src: font-url("<%= font_path('proximanova-regular-webfont.eot') %>"); 
    src: font-url("<%= font_path('proximanova-regular-webfont.eot') %>") format('embedded-opentype'), 
    font-url("<%= font_path('proximanova-regular-webfont.woff') %>") format('woff'), 
    font-url("<%= font_path('proximanova-regular-webfont.ttf') %>") format('truetype'), 
    font-url("<%= font_path('proximanova-regular-webfont.svg#ProximaNovaRegular') %>") format('svg'); 
} 

@font-face { 
    font-family: 'ProximaNovaBold'; 
    src: url("<%= font_path('proximanova-bold-webfont.eot') %>"); 
    src: url('<%= font_path('proximanova-bold-webfont.eot') %>") format('embedded-opentype'), 
    url("<%= font_path('proximanova-bold-webfont.woff') %>") format('woff'), 
    url("<%= font_path('proximanova-bold-webfont.ttf') %>") format('truetype'), 
    url("<%= font_path('proximanova-bold-webfont.svg#ProximaNovaBold') %>") format('svg'); 
} 

@font-face { 
    font-family: 'boxyfont'; 
    src: url("<%= font_path('04b_19__-webfont.eot') %>"); 
    src: url("<%= font_path('04b_19__-webfont.eot?#iefix') %>") format('embedded-opentype'), 
    url("<%= font_path('04b_19__-webfont.svg#04B_19__') %>") format('svg'), 
    url("<%= font_path('04b_19__-webfont.woff') %>") format('woff'), 
    url("<%= font_path('04b_19__-webfont.ttf') %>') format('truetype"); 
} 

我想使用一個類（.MID）住房「四四方方的字體」的H2 - 看到它的代碼：

.mid { 
    padding-bottom: 50px; 
    font-family: 'boxyfont'; 
} 

雖然這不起作用，但它只顯示標準的默認字體。我究竟做錯了什麼？

Answer 1

也許是因爲字體聲明的url部分與指定字體不一樣。

看到這個問題的答案。 https://stackoverflow.com/a/10907276/3261328

Answer 2

在，你應該已經下'/app/assets/fonts/'存儲這些字體的假設（滑軌> = 3.1使用資產存儲各種靜態文件），我建議你應該更換：

font_path與asset_path

即

@font-face { 
    font-family: 'ProximaNovaRegular'; 
    src: url("<%= asset_path('proximanova-regular-webfont.eot') %>"); 
    src: url("<%= asset_path('proximanova-regular-webfont.eot') %>") format('embedded-opentype'), 
    url("<%= asset_path('proximanova-regular-webfont.woff') %>") format('woff'), 
    url("<%= asset_path('proximanova-regular-webfont.ttf') %>") format('truetype'), 
    url("<%= asset_path('proximanova-regular-webfont.svg#ProximaNovaRegular') %>") format('svg'); 
} 

@font-face { 
    font-family: 'ProximaNovaBold'; 
    src: url('<%= asset_path('proximanova-bold-webfont.eot') %>'); 
    src: url('<%= asset_path('proximanova-bold-webfont.eot') %>t') format('embedded-opentype'), 
    url('<%= asset_path('proximanova-bold-webfont.woff') %>') format('woff'), 
    url('<%= asset_path('proximanova-bold-webfont.ttf') %>') format('truetype'), 
    url('<%= asset_path('proximanova-bold-webfont.svg#ProximaNovaBold') %>') format('svg'); 
} 

@font-face { 
    font-family: 'boxy-font'; 
    src: url('<%= asset_path('04b_19__-webfont.eot') %>'); 
    src: url('<%= asset_path('04b_19__-webfont.eot') %>t') format('embedded-opentype'), 
    url('<%= asset_path('04b_19__-webfont.woff') %>') format('woff'), 
    url('<%= asset_path('04b_19__-webfont.ttf') %>') format('truetype'), 
    url('<%= asset_path('04b_19__-webfont.svg#04B_19__') %>') format('svg'); 
} 

希望那會去很好..