0

我正在尝试实现以下外观： http: //www.primefaces.org/showcase/ui/selectManyCheckbox.jsf

请注意，PrimeFaces 展示站点的组件周围没有 css-borders。

 <h:outputText value="Horizontal: " />  
 <p:selectManyCheckbox value="#{formBean.selectedOptions}">  
   <f:selectItem itemLabel="Option 1" itemValue="Option 1" />  
   <f:selectItem itemLabel="Option 2" itemValue="Option 2" />  
   <f:selectItem itemLabel="Option 3" itemValue="Option 3" />  
 </p:selectManyCheckbox>

但是，在我的实现中，组件周围出现了不需要的边框。我试图添加 style="border-style: none;" IE

<p:selectManyCheckbox value="#{formBean.selectedOptions}" style="border-style: none;">

没有任何结果。我有一个 default.css 文件，根据：

.ui-widget, .ui-widget .ui-widget {
    font-size: 80% !important;
}

我不认为 css 资源会对这个问题产生任何影响，但我可能错了。

我看不出不同浏览器之间的外观有任何差异。

你能告诉我为什么我有边界以及如何摆脱它们，只在这个特定的组件上？

此致

4

2 回答 2

1

边界？Primefaces'p:selectManyCheckbox默认没有边框。

无论如何，如果您想覆盖任何样式规则，您可以使用!important.

这应该删除任何边框：

<p:selectManyCheckbox value="#{formBean.selectedOptions}" style="border-style: none !important;">
于 2012-08-02T12:55:30.220 回答
0

我不同意没有国界。我尝试删除我所有的 CSS，但我仍然有边框。可能是特定主题的。

我不得不使用以下内容：

.noBorder tr,.noBorder td {
    border: none !important;
}



<p:selectManyCheckbox value="#{formBean.selectedOptions}" styleClass="noBorder">
                        <f:selectItem itemLabel="Option 1" itemValue="Option 1" />
                    </p:selectManyCheckbox>
于 2012-10-14T13:00:16.760 回答