如何自定义primefaces组件的外观和感觉？

Question

如何设置主要组件的样式并在网页上指定其位置？任何样本可下载应用程序的链接将受到高度赞赏.

Answer 1

组件的位置:

Primefaces有一些具有位置属性的组件,例如p:dialog:

<p:dialog header=”Header Text” widgetVar=”dialog” position=”10,50”>
 ...
</p:dialog>

在示例中,位置以与浏览器窗口左上角相关的[x,y]对给出.这里也允许诸如"顶部","底部","左","右"或"中心"的值.如果省略该属性,则对话框的位置居中.

对于所有其他组件,css定位可以使用由style或styleClass属性定义,该属性可用于许多Primefaces组件或在单独的css布局中定义.

以下示例为以下内容设置绝对位置p:dataTable:

<p:dataTable value="#{testBean.selectOptions}" var="item"
             style="position:absolute; top:50px; left:240px;">

Primefaces甚至还带有一个自己的p:layout标签,也可用于定位.

样式

这可以使用Primefaces主题来完成.此外,Primefaces文档(您必须从2.1版开始付费)列出了每个组件的所有css样式类.您可以根据自己的需要进行调整.