2017-01-20 6 views
1

現在、ng-bootstrapをAngular 2プロジェクトに使用しています。 ngb-tabで丸薬の色を変更する必要があります。私は、ラベルのスタイルを要素に置こうとしましたが、動作しません。手伝って頂けますか?ngb-bootstrapタブにスタイルを与える方法

例:

<ngb-tab *ngIf="isNotPending" style="background-color: rgb(255, 255, 255)"> 
 
    <template ngbTabContent> 
 
     <div id="img_centered" class="col-md-12"> 
 
     <img style="padding: 30px;" src="assets/images/happy.PNG" alt="Hello" > 
 
     </div> 
 
    </template> 
 
</ngb-tab>

よろしく!

答えて

1

ngb-tabにあるライブラリのスタイルシートをインポートして、ローカルスタイルシートの後にそれらのスタイルがロードされることがあります。あるいは、他の要素を追加しているngb-tabのコンパイルがあるかもしれません。

この問題を解決するには、いくつかの方法があります。

<link>タグと "CDN"を探します。それはあなたのローカルプロジェクトのスタイルシートでいたら、あなたはそれを変更したり、また、あなたの地元のスタイルシートに!important宣言を使用することができます。

ngb-tab { 
    background-color: rgb(255, 255, 255); /* come on brah, use #fff */ 
} 

もしカスケード(CSS = C ascading S tyle Sヒット)問題ではない場合は、正しい要素の色を実際に変更しようとしているかどうかをDOMで調べてください。

+0

あなたの答えをありがとうが、このスタイルを適用した場合、私は他のタブを変更します。 * ngIf = "isNotPending"で色を変更する場合にのみ、このタブを表示する必要があります。 –

0

あなたのプロジェクトのグローバルCSSファイルにCSSを書き込んでください。または、インポートファイル "styleUrls:['./ example.component.css']を削除し、CSSクラスをスタイル:['.example {Some css ...}']

関連する問題