是否可以从 Primefaces 组件中删除所有样式?我的意思是,组件集很好,但是必须手动覆盖每个组件的每一点以使组件样式适合我的应用程序的整体设计并不好。我不能用几个小时来使用 Firebug 来查找它使用的类等等。
那么有没有办法删除它,只使用组件的功能并提供您自己的设计,而不是被迫使用默认......或“主题”之一?
是否可以从 Primefaces 组件中删除所有样式?我的意思是,组件集很好,但是必须手动覆盖每个组件的每一点以使组件样式适合我的应用程序的整体设计并不好。我不能用几个小时来使用 Firebug 来查找它使用的类等等。
那么有没有办法删除它,只使用组件的功能并提供您自己的设计,而不是被迫使用默认......或“主题”之一?
将primefaces.THEME
context 参数设置为none
,您将获得一个没有样式的功能性 ui。
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>none</param-value>
</context-param>
您无需花费数小时编辑样式。PrimeFaces 的样式是通过共享样式完成的ui-widget-header
,ui-widget-content
您可以通过themeroller网络表单进行自定义。我不认为 JSF 和主题可以比 PrimeFaces 更容易。
PrimeFaces 默认插入两个 CSS 文件,theme.css
并且primefaces.css
. 您可以theme.css
通过将以下内容删除web.xml
:
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>none</param-value>
</context-param>
然后您可以通过在以下位置创建一个空文件来覆盖primefaces.css
:
WebContent/resources/primefaces/primefaces.css
较旧的 PF 版本 (<6.0)
如果您想将 primefaces 与您自己的 css 一起使用,使用jQuery UI - ThemeRoller创建您自己的主题不是更容易吗?
较新的 PF 版本(6.0 及更高版本)
最近 PrimeFaces 引入了“Designer API”由于 PF 组件具有更多功能,因此主题滚轮不再那么适合了。Designer API 基于 SASS,允许您创建非常好的主题
正如@Daniel 所说,创建自己的主题。我只想补充:
对于部分样式,您不必触发所有内容,primefaces用户指南涵盖了每个元素的样式类。它还包含其他非常有用的信息和提示(也是关于蒙皮的部分)。因此,当您发现自己正在为有关 primefaces 的任何事情而苦苦挣扎时,请使用它作为您的第一个来源。