如何在selectOneButton中的按钮之间添加空格

Mah*_*leh 2 css jsf primefaces

我正在使用selectOneButton,我想在按钮之间添加空格,如果可能的话,更改选择背景颜色,请告知如何做到这一点,谢谢.

这是代码:

    <p:selectOneButton value="#{buttonBean.number}">  
        <f:selectItem itemLabel="Option 1" itemValue="1" />  
        <f:selectItem itemLabel="Option 2" itemValue="2" />  
        <f:selectItem itemLabel="Option 3" itemValue="3" />  
    </p:selectOneButton>
Run Code Online (Sandbox Code Playgroud)

Kev*_*vin 5

一个例子:

body .ui-buttonset .ui-button {
    margin-right: 10px;
}
Run Code Online (Sandbox Code Playgroud)

body是因为规则更具体,因为主要规则.

或者,您可以包含样式表,如下所示:

     <f:facet name="last">
        <!-- Runs after primefaces css. I can't get <outputStylesheet/> to work here, however. -->
        <link rel="stylesheet" type="text/css" href="#{facesContext.externalContext.requestContextPath}/resources/css/index.css"/>
    </f:facet>
Run Code Online (Sandbox Code Playgroud)

这允许同样特定的样式覆盖primefaces样式.

您需要在浏览器中查阅HTML/CSS检查工具以确定要使用的CSS.