bootstrap.cssを変更する

Question

bootstarp.cssを使用するHTMLページを編集したいと思います。

 <input type="submit" class="btn btn-primary btn-block btn-md" value="Create"> 

を含む行がbootstrap.cssに

.btn { 
    display: inline-block; 
    *display: inline; 
    padding: 4px 12px; 
    margin-bottom: 0; 
    *margin-left: .3em; 
    font-size: 24px; 
    line-height: 20px; 
    .. 
} 

を指します。しかし、font-sizeを変更すると、更新後にブラウザに変更が表示されません。それでは問題は何ですか？

Answer 1

でのスタイルのオーバーライドあなたはは、変更または何らかの方法でブートストラップのデフォルトのCSSファイルに変更を加えるべきではないことを確認するスタイルで!importantを使用することができます独自の CSSファイルを作成し、それを使用してこれらのデフォルト値を上書きすると、もっと簡単に練習できます。

これは基本的にはmyown.cssファイルを作成し、の後にブートストラップのCSSであるを含めることです。

フレームワークで作業しているときには絶対に推奨されていない!importantのものを必要とせずに、デフォルトのスタイルセットを自分で簡単に上書きすることができます。

Answer 2

ライブラリファイルを変更するのは良い方法ではありません。したがって、同じスタイルの複製を作成し、ローカルスタイルのファイルに入れる方がよいでしょう。あなたはかなり簡単に混乱物事をできる限りbootstrap.css

.btn { 
    font-size: 24px !important; 
}