[解決済み] Twitter Bootstrap の navbar の色
2022-09-12 15:59:16
質問
Twitter Bootstrap 2.0.2のナビバーの背景色を変更するにはどうすればよいですか? ナビバーのすべての要素の色を変更して、背景色を反映させるにはどうすればよいですか。
どのように解決するのですか?
ブートストラップ・カラーを上書きすることができ、その中には
.navbar-inner
クラスも含めてブートストラップ・カラーを上書きすることができます。
.navbar-inner {
background-color: #2c2c2c; /* fallback color, place your own */
/* Gradients for modern browsers, replace as you see fit */
background-image: -moz-linear-gradient(top, #333333, #222222);
background-image: -ms-linear-gradient(top, #333333, #222222);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#333333), to(#222222));
background-image: -webkit-linear-gradient(top, #333333, #222222);
background-image: -o-linear-gradient(top, #333333, #222222);
background-image: linear-gradient(top, #333333, #222222);
background-repeat: repeat-x;
/* IE8-9 gradient filter */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
}
これらのスタイルをすべて独自のものに変更すれば、それが取り込まれます。たとえば、このような例では、グラデーション効果をすべて排除して、黒一色の背景色を設定するだけです。
.navbar-inner {
background-color: #000; /* background color will be black for all browsers */
background-image: none;
background-repeat: no-repeat;
filter: none;
}
などを活用することができます。 Colorzilla グラデーションエディタ といったツールを活用し、すべてのブラウザに対応した独自のグラデーションカラーを作成し、元の色を自分の色に置き換えることができます。
そして、コメントで述べたように、bootstrap.cssスタイルシートを直接修正することはお勧めしません。なぜなら、スタイルシートが更新されると、すべての変更が失われるからです(現在のバージョンは v2.0.2 である) ので、 bootstrap.css スタイルシートと一緒に、 あなた自身のスタイルシートの中にすべての変更を含めることが望ましいです。しかし、ブラウザ間の一貫性を持つために、適切なプロパティのすべてを上書きすることを忘れないでください。
関連
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] Bootstrapの列をすべて同じ高さにするにはどうしたらいいですか?
-
[解決済み] Bootstrap3による垂直方向の整列
-
[解決済み] BootstrapのモーダルウィンドウをjQueryで開くには?
-
[解決済み] node.jsのコンソールのフォントカラーを変更する方法は?
-
[解決済み] Twitter Bootstrapでナビバーの色を変更する
-
[解決済み] Twitter Bootstrap - 行と行の間に上部のスペースを追加する
-
[解決済み] SVGの塗りつぶし色の透明度/アルファ値?
-
[解決済み】twitter bootstrapのナビバーが上に重なるのを修正したサイト
-
[解決済み】Bootstrap 3 ナンバーバーの折りたたみについて
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] このように色を表現する場合、#ffffffと0xffffはどう違うのでしょうか?
-
[解決済み] ランタイム中にテキストの色を変更する(Unity)?
-
[解決済み] zshでプロンプトの色を変える(通常のテキストと違う)にはどうしたらいいですか?
-
[解決済み] Twitter Bootstrapでナビバーの色を変更する
-
[解決済み] SVGの塗りつぶし色の透明度/アルファ値?
-
[解決済み】背景色によって文字色を白や黒にする方法は?
-
[解決済み】ANSIカラーエスケープシーケンス一覧
-
[解決済み] 透明なARGBの16進数値
-
[解決済み] RGBの値がある場合、どのように色合い(シェード)を作成するのですか?
-
[解決済み] なぜcmyではなくrgbなのか?[クローズド]