無法覆蓋bootstrap-sass的字體與字體真棒

我正在使用bootstrap-sass和字體真棒（https://github.com/littlebtc/font-awesome-sass-rails）寶石。我想重寫font-awesome的引導字體設置。無法覆蓋bootstrap-sass的字體與字體真棒

從font-awesome的網站我可以覆蓋bootstrap的默認值，如果我只是導入後，如果bootstrap的導入。

@import 'bootstrap'; 
@import 'font-awesome';

我已經完成了上述操作，但是font-awesome的字體並未重寫。我把我的項目推到github - https://github.com/murtaza52/rails-base。網址是本地主機上訪問：3000 /職位

，我將不勝感激，如果有人能幫助我重寫引導程序的默認字體與那些字體真棒的

來源

2012-08-02 murtaza52

外部CSS樣式表爲您的網頁顯示什麼樣的順序？（查看要檢查的頁面的源代碼。） – Ari 2012-08-02 14:05:37

它將所有東西編譯成一個application.css。在application.css裏面，它們包含在bootstrap的順序中，然後是字體真棒樣式。 – murtaza52 2012-08-03 05:28:49

修改您application.css.scss看起來像下面

@import "font-awesome"; 
$baseFontFamily: 'FontAwesome'; 
@import "bootstrap"; 

... 

@import "bootstrap-responsive"; 
//@import "scaffolds"; 
@import "posts";

爲什麼？

你在上面移動import "font-awesome"，然後定義baseFontFamily，因爲這是引導用來定義爲font-family所有元素。在中間檢查Typography and links塊。如果在此之後import bootstrap，則默認使用FontAwesome。
您應該刪除import "scaffolds";行，因爲scaffolds.css.scss將重置您的字體家族爲body元素，該元素將由每個其他元素繼承。

如果你無法避免在引導前導入它。我希望有所幫助。

來源

2012-08-05 12:40:33

感謝您的回覆。 – murtaza52 2012-08-22 05:57:37

這幫助我得到了FontAwesome 4（通過font-awesome-rails gem）來與bootstrap-sass-rails一起工作。謝謝 – kbjerring 2013-10-24 02:34:37

我不知道如果這能幫助你，但至少有些時候模板代碼似乎有效，你需要用ctrl + shirt + r強制刷新瀏覽器才能看到更改（至少在mozilla中有效）。

來源

2012-08-02 20:57:23

對於那些你們使用引導3.2+（我猜）的，這裏就是你可以修改SASS的變量列表：

https://github.com/twbs/bootstrap-sass/blob/master/assets/stylesheets/bootstrap/_variables.scss

在我們的例子中，我們要確保之前定義$font-family-base做@import "bootstrap"。

通過達到下面的行之前設置$font-family-base，自舉使用我們$font-family-base代替（否則，則默認爲$font-family-base-serif，在上面的variables.scss定義）。

$font-family-base: $font-family-sans-serif !default;

這是我application.css.sass看起來像

/* 
*= require_tree . 
*= require_self 
*/ 

@import "fonts" 
@import "compass" 
@import "bootstrap"

和我有在_fonts.css.sass（你不必把它在一個單獨的文件）

以下

$font-family-sans-serif: 'Roboto', verdana, arial, sans-serif

來源

2014-08-01 12:03:48 Abdo

無法覆蓋bootstrap-sass的字體與字體真棒

回答

相關問題