2016-03-24 19 views
0

は、私は何も変わりません。このpost 生成されたコードで推奨されていました。このbootstrap generatorを使用していた、と私の推測では、私がどこかで私のラベルの上に台無しです。ブートストラップのnavbar cssが機能しないのはなぜですか?

<div style="background-color: #18305c"> 
    <div class="container text-center"> 
    <nav class="navbar navbar-default" role="navigation"> 
     <div class="btn-group" role="group" aria-label="..."> 
     <button type="button" class="btn btn-default"> 
      Home 
     </button> 
     <div class="btn-group" role="group"> 
      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
      Browse <span class="caret"></span> 
     </button> 
      <ul class="dropdown-menu"> 
      <li><a href="#">Latest Offers</a></li> 
      <li><a href="#">Newest Listings</a></li> 
      <li><a href='#'>Clearance</a></li> 
      <li><a href='#'>Search</a></li> 
      <li><a href='#'>Blog</a></li> 
      </ul> 
     </div> 

CSSは

.navbar-default { 
background-color: #18305c; 
border-color: #d49418; 
} 
.navbar-default .navbar-brand { 
color: #ffffff; 
} 
.navbar-default .navbar-brand:hover, 
.navbar-default .navbar-brand:focus { 
color: #ffffff; 
} 
.navbar-default .navbar-text { 
    color: #ffffff; 
} 

なぜそれが変更されていないように見えますか?

編集:これを追加したいがナビゲーションバーの上部のみです。同様のドロップダウンを持つボタンがもう少しあります。

+0

それはどういう意味1 plnkr – Aparna

+0

を作成してください? //codepen.io/niners52/pen/: –

+0

https://plnkr.co/にコードを記述し、ここで私たちは、コードを実行することができ、そしてそれは誰もがここでは簡単に – Aparna

答えて

0

大丈夫です。上記のコメントを読んで、ボタンの色を変更したいとします。

クラスbtn-defaultを使用しました。ボタンの色を青色にする場合は、クラスをbtn-primaryに変更してください。

アウトさまざまなボタンの色のため、このlink

+0

私は標準的な色を使いたくありません。私はこれを使用しようとしています.- http://work.smarchal.com/twbscolor/ –

+0

その後、ブートストラップCSSをカスタマイズすることができます。特定のIDを要素に付けます。たとえば、ボタンを押して背景色を変更します。 <ボタンタイプ= "ボタン" ID = "ホーム" クラス= "BTN BTN-デフォルトのドロップダウン・トグル" データ・トグル= "ドロップダウン">ホーム // CSS #home {背景色:紫} – Aparna

関連する問題