删除特定数据表上的所有边框

Posted 2023-02-22

【中文标题】删除特定数据表上的所有边框

【英文标题】：Remove all borders on a specific datatable

【发布时间】：2013-09-23 16:24:29

【问题描述】：

我需要使用 PrimeFaces 隐藏一个数据表的所有边框，而不是全部边框。我已经尝试了很多事情，但没有人奏效。有人知道怎么做吗？

我已将以下样式（分别）应用于ui-datatable 类：

border: hidden !important;    
border-style: none !important;

还有一件事……

【问题讨论】：

请发布您的代码，并显示您要更改的表格。

【参考方案1】：

使用 JSF 2、PrimeFaces 3.5

<p:dataTable ... styleClass="borderless">

css:

.borderless .ui-datatable thead th,
.borderless .ui-datatable tbody,
.borderless .ui-datatable tbody tr,
.borderless .ui-datatable tbody td 
    border: none;
    display: none;

对于数据表头：

.borderless .ui-state-default,
.borderless .ui-widget-content .ui-state-default,
.borderless .ui-widget-header .ui-state-default 
    border: none;

【参考方案2】：

假设一个PrimeFaces 3.5数据表标记如下，

<p:dataTable ... styleClass="borderless">

那么这种风格应该可以：

.ui-datatable.borderless thead th,
.ui-datatable.borderless tbody,
.ui-datatable.borderless tbody tr,
.ui-datatable.borderless tbody td 
    border-style: none;