css - 从所有 PrimeFaces p:panelGrid 组件中移除边框

Question

我需要使用 primefaces 隐藏所有面板网格的所有边框。我试过他没有效果：

table {
    border: none;
}

table tr, table td {
    border: none;
}

我能做些什么？

Answer 1

您需要至少与 PrimeFaces 默认选择器一样具体。

.ui-panelgrid>*>tr,
.ui-panelgrid .ui-panelgrid-cell {
    border: none;
}

!important除非您需要覆盖styleHTML 元素上的硬编码，否则请勿使用。

也可以看看：

• 如何从特定的 PrimeFaces p:panelGrid 中删除边框？
• 如何使用自定义样式覆盖默认的 PrimeFaces CSS？

Answer 2

此解决方案仅影响 panelGrids，但影响 dataTables：

.ui-panelgrid > * > tr, .ui-panelgrid > * > tr > td.ui-panelgrid-cell {
    border: none;
}

感谢 Kukeltje在这里发布的答案：删除所有面板网格上的所有边框而不是数据表

Answer 3

可能是您的 CSS 在其他地方被覆盖。您可以尝试使用该!important规则。

table, table tr, table td {
   border: none !important;
}

Answer 4

在 primefaces 5.1 上测试

.ui-widget-content {
border: none;
}

Answer 5

Primefaces 5中的这项工作

.ui-panelgrid-content {
    border: none;
}