我有一个<rich:popupPanel>我必须要风格的.我检查了元素,发现使用了以下CSS.
.rf-pp-hdr-cnt {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-weight: bold;
font-family: Arial, Verdana, sans-serif;
font-size: 17px;
}
现在我对这个CSS进行了更改,并将其包含在我的CSS文件中.但是,我的自定义CSS将被忽略,并且会读取原始的RichFaces样式.如何使用我的自定义CSS并覆盖原始CSS？
首先,您需要确保选择器至少与您要覆盖的样式的原始选择器一样强.因此,如果你想要覆盖的原始样式是由例如.rf-something-else .rf-pp-hdr-cnt {}更强(更具体)的选择器指定的,那么它总是优先,除非你!important为每个被覆盖的样式添加(丑陋)属性.
其次,您需要确保在RichFaces 之后加载了自定义CSS .实现这一目标最简单的方法是使用<h:outputStylesheet>的<h:body>.
<h:head>
...
</h:head>
<h:body>
<h:outputStylesheet name="custom.css" />
...
</h:body>
这样,在所有自动包含的JSF/RichFaces资源之后,它将隐式地重新定位到HTML 的末尾.<head>