PrimeNGタブビューのタブパネルヘッダーのインラインスタイル

Question

私のアプリケーションはPrimeNG 1.1.2とAngular 2.4.1を実行します。私のテンプレートでは、対応するタブパネルとそれぞれのヘッダーを持つPrimeNGタブビューを使用します。特定の理由から、私はタブパネルのヘッ​​ダの外観をスタイルする必要があります。例えば は、私が緑にそのフォントの色を設定したいと言う：

<p-tabPanel header="Bezier Curve" [selected]="true" 
[headerStyle]="{'color': 'green'}"> 

しかし、このスタイルが適用されないと、フォントの色は、私が行方不明です何

任意のポインタを変更しませんか？

編集： font-colorはcolor

Answer 1

に置き換え名前font-colorとはCSSプロパティはありませんが、あなたはcolorを探しています：

<p-tabPanel header="Bezier Curve" [selected]="true" [headerStyle]="{'color': 'green'}"> 

W3Schoolsは明確に述べている：

プロパティcolor - テキストの色を設定します

編集：

問題があり、次の - テンプレートのレンダリング後に、ヘッダーテキストは、あなたが囲まれたテキストの色を変更しますCSSクラスを作成する必要がありますを意味しているaタグの間に配置されていますあなたのヘッダー内のaタグ：

.greenText a { 
    color: green; 
} 

そしてCSSクラス適用する代わりにheaderStyleのheaderStyleClass属性を使用します。

<p-tabPanel header="Bezier Curve" [selected]="true" headerStyleClass="greenText">  

Answer 2

はもちろんstyle.css

.ui-tabview-title{  
     color:green !important; 
}