3

我在 JSF 中使用 PrimeFace 对话框。问题是 PrimeFaces 对话框标题是灰色的，我的客户认为它类似于非活动对象，因为窗口使用灰色表示某些东西是非活动的。

那么有什么方法可以设置 PrimeFace 对话框的标题背景颜色？

PrimeFace Dialog的代码：

<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 的 styleclass 声明为“overlayDialog”。

并且，在 css 文件中， .overlayDialog div.ui-dialog-titlebar{background....}

于 2013-04-26T13:34:38.357 回答
1

右键单击您的对话框和“检查元素”（在 Chrome 中，可以使用 Firebug 或 eq。）并找到对话框的类，应该类似于.ui-dialog .ui-dialog-titlebar.

然后在你的 CSS 中按照你喜欢的方式设置它的样式。

于 2013-04-26T13:35:59.157 回答