我应该如何全局且仅一次地更改和应用对素数面的默认样式的更改？
.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？以深入解释如何重新定义PF样式）
使用<h:outputStylesheet>将其包含在模板的<h:body>中（在所有PrimeFaces自己的样式表之后，它将自动重新定位到HTML头的端）：
<h:body>
<h:outputStylesheet name="css/default.css" />
...
</h:body>
如果您没有使用主模板，因此需要将其包含在每个页面中，我建议您重新考虑页面设计，并使用JSF2Facelets模板功能。通过这种方式，您只有一个主模板文件，其中定义了头和体的所有默认值。关于一个具体的例子，请参阅这个答案：如何使用JSF 2.0 Facelets在XHTML中包含另一个XHTML？
我建议使用：
.ui-widget {
font-size: 90%;
}
.ui-widget .ui-widget {
font-size: 100%;
}
而不是BalusC的方法，除非喜欢，否则字体大小会随着JSF组件的嵌套而减小。
我同意BalusC的观点，即应该创建一个样式表并考虑模板化，但我不同意建议的CSS（尽管我还没有决定使用!important！）。
Primefaces 3.1用户指南第8.4节建议使用
.ui-widget, .ui-widget .ui-widget {
font-size: 90% !important;
}
这与BalusC的建议类似，但使用了CCD_ 6。
这将做两件事：
- 使用
ui-widget类将组件的字体大小设置为90%（父母的） - 使用
ui-widget设置组件的字体大小类和是具有ui-widget的另一个组件的子级类到90%（父类）
是否确实要将嵌套ui-widget的字体大小设置为90%？如果您有2或3层嵌套的ui-widgets，字体大小将不断减小。尝试以下（Primefaces）JSF标记，您就会明白我的意思。
<h:form>
<p:button value="Normal"></p:button>
<p:panel>
<p:button value="A bit smaller"></p:button>
<p:panel>
<p:button value="Even smaller again"></p:button>
<p:panel>
<p:button value="Tiny"></p:button>
</p:panel>
</p:panel>
</p:panel>
</h:form>
我相信标准jQuery CSS中需要.ui-widget .ui-widget的原因是为了防止出现相反的问题：嵌套的ui-widget s中字体大小增加。
默认样式通常如下：
.ui-widget { font-family: Verdana,Arial,sans-serif; font-size: 1.1em; }
.ui-widget .ui-widget { font-size: 1em; }
如果没有为.ui-widget .ui-widget定义的样式，则应用于.ui-widget的默认font-size: 1.1em样式会导致嵌套ui-widget s中的字体大小增加。
通过添加字体大小设置为100%（或1em）的更具体的.ui-widget .ui-widget选择器，无论组件嵌套有多深，您都将确保获得一致的字体大小。
它可以很好地与以下css 配合使用
body {
font-size: 75% !important;
}
.ui-widget,.ui-widget-header,.ui-widget-content,.ui-widget-header .ui-widget-header,.ui-widget-content .ui-widget-content,.ui-widget input,.ui-widget select,.ui-widget textarea,.ui-widget button
{
font-size: 100% !important;
}
这很好用。
.ui-g {
font-size: 13px;
}