我应该如何全局更改并将更改应用到primefaces的默认样式并且仅一次?
.ui-widget,.ui-widget .ui-widget {
font-size: 90% !important;
}
目前,我将此 CSS 片段嵌入到每个 XHTML 页面的头部。
<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
“黑客”,另见如何使用自定义样式覆盖默认的 PrimeFaces CSS? https://stackoverflow.com/questions/8768317/how-do-i-re-write-those-class-defined-in-primefaces-css/8774997#8774997深入解释如何重新定义 PF 风格)
将其包含在<h:body>
您的模板使用<h:outputStylesheet>
(它将自动迁移到endHTML 头的部分,毕竟 PrimeFaces 自己的样式表):
<h:body>
<h:outputStylesheet name="css/default.css" />
...
</h:body>
如果您没有使用主模板,因此需要将其包含在每个页面中,我建议重新考虑您的页面设计并利用 JSF2 Facelets 模板功能。这样,您就只有一个主模板文件,其中定义了头部和主体的所有默认值。另请参阅此答案的具体示例:如何使用 JSF 2.0 Facelets 在 XHTML 中包含另一个 XHTML? https://stackoverflow.com/questions/4792862/how-to-include-another-xhtml-in-xhtml-using-jsf-2-0-facelets/4793959#4793959
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)