全局改变Primefaces中的默认样式 [英] Globally changing default style in Primefaces
问题描述
我应该如何更改和应用更改默认样式的全局和只有一次？
How should I change and apply changes to the default style of primefaces globally and only once?
.ui-widget,.ui-widget .ui-widget {
font-size: 90% !important;
}
目前，我将此CSS代码段嵌入每个XHTML页面的头部。
Currently, I am embedding this CSS snippet in the head of every XHTML page.
<head>
<style type="text/css">
.ui-widget,.ui-widget .ui-widget {
font-size: 90% !important;
}
</style>
</head>
推荐答案
创建样式表文件
/resources/css/default.css
.ui-widget, .ui-widget .ui-widget {
font-size: 90%;
}
（请注意，我移除了 ！important hack，另请参见如何重新编写在primefaces.css中定义的类？以深入解释如何重新定义PF风格）
(please note that I removed the !important "hack", see also How do I re-write those class defined in primefaces.css? for an in-depth explanation of how to redefine PF styles)
使用< h：outputStylesheet>
Include it in the <h:body> of your template using <h:outputStylesheet> (it will be auto-relocated to the end of the HTML head, after all PrimeFaces own stylesheets):
<h:body>
<h:outputStylesheet name="css/default.css" />
...
</h:body>
如果您不使用主模板，因此需要在每个页面中包含此模板建议重新考虑您的页面设计，并利用JSF2 Facelets模板功能。这样，您只有一个主模板文件，其中头部和主体的所有默认值都已定义。另请参见此答案的具体示例：如何使用JSF 2.0 Facelets在XHTML中包含另一个XHTML？
If you aren't using a master template and thus need to include this in every single page, I recommend to reconsider your page design and to utilize JSF2 Facelets templating capabilities. This way you've only one master template file where all defaults of both the head and the body are definied. See also this answer for a concrete example: How to include another XHTML in XHTML using JSF 2.0 Facelets?
这篇关于全局改变Primefaces中的默认样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
