css - TwitterBootstrap-静的ナビゲーションバー

Question

TBのナビゲーションバーの背景色を変更するにはどうすればよいですか？http://twitter.github.com/bootstrap/index.htmlの上部のナビゲーションバーを見てください。に設定background-color: pink;してnavbar.navbar-inverse.navbar-fixed-topも何も起こりません。他の要素でも同じことをしてみました。色を変えられないようです。

Answer 1

次のCSSを追加し、色を変更します。背景のグラデーションの両端にあるため、#222222（暗い色）と（明るい色）を変更する必要があります。#111111両方を変更する必要があります。とその間の何かに変更#1b1b1bします。#252525

.navbar-inverse .navbar-inner {
    background-color: #1b1b1b;
    background-image: -moz-linear-gradient(top, #222222, #111111);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#222222), to(#111111));
    background-image: -webkit-linear-gradient(top, #222222, #111111);
    background-image: -o-linear-gradient(top, #222222, #111111);
    background-image: linear-gradient(to bottom, #222222, #111111);
    background-repeat: repeat-x;
    border-color: #252525;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff111111', GradientType=0);
}

.navbar-inverse .nav .active > a, .navbar-inverse .nav .active > a:hover, .navbar-inverse .nav .active > a:focus {
    color: #ffffff;
    background-color: #111111;
}

グラデーションが必要ない場合は、次の手順を実行して、背景色と境界線の色をそれぞれ「選択した」色に変更#1b1b1bします。#252525#111111

.navbar-inverse .navbar-inner {
    background-color: #1b1b1b;
    background-image: none;
    border-color: #252525;
    filter: none;
}

.navbar-inverse .nav .active > a, .navbar-inverse .nav .active > a:hover, .navbar-inverse .nav .active > a:focus {
    color: #ffffff;
    background-color: #111111;
}

Answer 2

bootstrap.cssの後にロードされた別のスタイルシートを使用してナビゲーションバーを変更しました。

.navbar {
  background-color: #2a2a86; /* fallback color, place your own */

  /* Gradients for modern browsers, replace as you see fit */
  background-image: -moz-linear-gradient(top, #3a3a96, #2a2a86);
  background-image: -ms-linear-gradient(top, #3a3a96, #2a2a86);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#3a3a96), to(#2a2a86));
  background-image: -webkit-linear-gradient(top, #3a3a96, #2a2a86);
  background-image: -o-linear-gradient(top, #3a3a96, #2a2a86);
  background-image: linear-gradient(top, #3a3a96, #2a2a86);
  background-repeat: repeat-x;

  /* IE8-9 gradient filter */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3a3a96', endColorstr='#2a2a86', GradientType=0);

}

次に、同じロジックをボタンなどに適用できます。

私には、基本色は要素の基本クラスに設定されているように見えるので、

.navbar
.btn

等

Answer 3

試す：

background-color: pink !important;