css - PrimeFaces会覆盖我的自定义CSS样式

我正在尝试创建不同颜色的primefaces命令按钮。在我的样式表中，我有这样的东西：

.styleGreen {
    background-color: #009900;
    font-family: Arial,Helvetica,sans-serif;
}

像这样的组件：

 <p:commandButton value="Green Button" styleClass="styleGreen" ...

当CommandButton不在PrimeFaces面板或其他容器中时，此操作有效。但是当我把它移到页面主体时，所有的定制css规则都会被覆盖。
解决这个问题的正确方法是什么？

最佳答案

简单的解决方案：
如果在这样的面板（或窗体）中有CommandButton：

<h:form .... >
    <p:commandButton value="Green Button" styleClass="styleGreen" ... />
</h:form>

你可以这样定义你的css：

form .styleGreen {
    background-color: #009900;
    font-family: Arial,Helvetica,sans-serif;
}

它会很好用的（我刚刚试过）