我无法从特定的PrimeFaces< p:panelGrid>中删除边框。
<p:panelGrid styleClass="companyHeaderGrid"> <p:row> <p:column> Some tags </p:column> <p:column> Some tags </p:column> </p:row> </p:panelGrid>
我已经能够从单元格中删除边框:
.companyHeaderGrid td { border: none; }
但
.companyHeaderGrid { border: none; }
不工作。
解决方法
边框已在生成的tr和td元素上设置,而不是在表上设置。所以,这应该做:
.companyHeaderGrid.ui-panelgrid>*>tr,.companyHeaderGrid.ui-panelgrid .ui-panelgrid-cell { border: none; }
我怎么找到它?只需检查生成的HTML输出和Chrome的webdeveloper工具集中的所有CSS样式规则(右键单击,Inspect Element或按F12)。 Firebug和IE9有类似的工具集。至于混乱,只要记住,JSF / Facelets最终生成HTML,该CSS仅适用于HTML标记,而不适用于JSF源代码。所以要应用/ finetune CSS,你需要看看在客户端(webbrowser)端。
也可以看看:
> How do I override default PrimeFaces CSS with custom styles?
> Remove border from all PrimeFaces p:panelGrid components
如果您仍然使用PrimeFaces 4或更旧版本,请改用下面的代码:
.companyHeaderGrid.ui-panelgrid>*>tr,.companyHeaderGrid.ui-panelgrid>*>tr>td { border: none; }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。