3

JSF で PrimeFace ダイアログを使用しています。問題は、PrimeFaces ダイアログのヘッダーの色が灰色であり、ウィンドウが非アクティブであることを示すために灰色を使用するため、クライアントがそれを非アクティブ オブジェクトに似ていると見なすことです。

PrimeFace ダイアログのヘッダーの背景色をスタイルする方法はありますか?

PrimeFace ダイアログのコード:

<p:commandButton id="modalDialogButton" value="Modal" onclick="dlg2.show();" type="button"/>  

<p:dialog id="modalDialog" header="Modal Dialog" widgetVar="dlg2" modal="true" height="100">  
<h:outputText value="This is a Modal Dialog." />  
</p:dialog>
4

3 に答える 3

8

Primefaces は、cssを使用したスタイルのオーバーライドをサポートしています。p:dialog少なくとも Primefaces 3.5 以降では、次のスタイル オプションを使用できます。

.ui-dialog - ダイアログのコンテナ要素
.ui-dialog-titlebar - タイトル バー
.ui-dialog-title-dialog - ヘッダー テキスト
.ui-dialog-titlebar-close - 閉じるアイコン
.ui-dialog-content ダイアログ- 本文

独自の CSS でデフォルトのスタイルを上書きするだけです。

古いリリース (3.5) を使用している場合は、お使いのバージョンのドキュメントをここで見つけてください。

于 2013-04-26T13:32:50.010 に答える
7

以下のプロセスを試してください。

最初のステップ: p:dialog のスタイルクラスを「overlayDialog」として宣言します。

そして、cssファイルでは、 .overlayDialog div.ui-dialog-titlebar{background....}

于 2013-04-26T13:34:38.357 に答える