如何隐藏MudDataGrid全部边框？Bordered="false"设置无效

方案一：组合使用内置参数 #

仅设置Bordered="false"无法完全清除所有层级的边框，需配合以下参数：

• 保留Bordered="false"关闭默认容器边框
• 设置HeaderClass="border-0"移除表头边框
• 设置RowClass="border-0"移除数据行边框
• 设置FooterClass="border-0"移除页脚边框

示例代码：

<MudDataGrid T="YourDataModel" Bordered="false" HeaderClass="border-0" RowClass="border-0" FooterClass="border-0">
    <!-- 列配置内容 -->
</MudDataGrid>

方案二：强制覆盖全局CSS样式 #

若内置参数仍有残留边框，直接通过CSS强制清除所有相关样式：

/* 清除DataGrid容器边框 */
.mud-data-grid {
    border: none !important;
}

/* 清除表头单元格底部边框 */
.mud-data-grid-header-cell {
    border-bottom: none !important;
}

/* 清除数据行单元格底部边框 */
.mud-data-grid-cell {
    border-bottom: none !important;
}

/* 清除页脚顶部边框 */
.mud-data-grid-footer {
    border-top: none !important;
}

将上述代码添加到项目全局样式文件（如wwwroot/css/app.css）中即可生效，若使用深色模式，需同步覆盖.mud-theme-dark下的对应类。

方案三：内联样式精准控制 #

针对单个DataGrid实例，直接通过Style参数为容器和列设置无边框：

<MudDataGrid T="YourDataModel" Bordered="false" Style="border:none;">
    <Columns>
        <PropertyColumn Property="x => x.Field1" Style="border:none;" />
        <PropertyColumn Property="x => x.Field2" Style="border:none;" />
        <!-- 其他列配置 -->
    </Columns>
</MudDataGrid>

内容的提问来源于stack exchange，提问作者obrana.boranija