讓我的自定義字體在Rails中工作4

我試圖得到一個自定義的字體在導軌4.在這裏工作是我在我的CSS：讓我的自定義字體在Rails中工作4

@font-face { 
    font-family: 'bebas'; 
    src: url('<%= asset_path 'bebasneue-webfont.eot' %>'); 
    src: url('<%= asset_path 'bebasneue-webfont.eot?#iefix' %>') format('embedded-opentype'), 
     url('<%= asset_path 'bebasneue-webfont.woff' %>') format('woff'), 
     url('<%= asset_path 'bebasneue-webfont.ttf' %>') format('truetype'), 
     url('<%= asset_path 'bebasneue-webfont.svg#bebas_neueregular' %>') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

我加入了字體文件到app/assets/fonts：

bebasneue-webfont-069a8fc829e693fcf470f2352359e221.woff 
bebasneue-webfont-56194c50f0b197ee12f067a502a17b30.svg 
bebasneue-webfont-755b9b8c0760ef96285f451dca15e4ba.eot 
bebasneue-webfont-7d82d863523d9e753d1e51e240a48b6f.ttf

在 config/application.rb

添加以下：

config.assets.paths << Rails.root.join("app", "assets", "fonts")

然後，我只是引用它爲t他在我的CSS標記以下：

.lineup .table .logos .price { 
    text-transform: uppercase; 
    font-family: 'bebas', sans-serif; 
}

這似乎並沒有伎倆。有什麼明顯的缺失？

來源

2014-06-09 randombits

-1

試試這個：

@font-face { 
    font-family: 'bebas'; 
    src: url("<%= asset_path 'bebasneue-webfont.eot' %>"); 
    src: url("<%= asset_path 'bebasneue-webfont.eot?#iefix' %>") format('embedded-opentype'), 
     url("<%= asset_path 'bebasneue-webfont.woff' %>") format('woff'), 
     url("<%= asset_path 'bebasneue-webfont.ttf' %>") format('truetype'), 
     url("<%= asset_path 'bebasneue-webfont.svg#bebas_neueregular' %>") format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

爲了得到url(<%= asset_path(...) %>)工作文件需要有擴展.css.erb

來源

2014-06-09 17:40:34 8bithero

但我使用.css.erb擴展名。 – randombits

嘗試在您的原始代碼中使用'font-url'而不是'url' – 8bithero

實際上可能會嘗試使用'src：asset-url'或'url'或嘗試刪除圍繞您的erb標記的單引號：'' <％= asset_path'bebasneue-webfont.eot'％>'（參見上面的編輯） – 8bithero

你會使用scss/sass preprocessor得到這個工作（而不是最好Rails的ERB預處理）：

#app/assets/stylesheets/application.css.scss 
@font-face { 
    font-family: 'bebas'; 
    src: asset_url("bebasneue-webfont.eot"); 
    src: asset_url("bebasneue-webfont.eot?#iefi") format('embedded-opentype'), 
     asset_url("bebasneue-webfont.woff") format('woff'), 
     asset_url("bebasneue-webfont.ttf") format('truetype'), 
     asset_url("bebasneue-webfont.svg#bebas_neueregular") format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

這意味着當您預編譯的資產，正確urls將被調用（即使有fingerprinted文件）。它也應該在開發

來源

2014-06-10 10:00:50

讓我的自定義字體在Rails中工作4

回答

相關問題