Style AG Grid 的 rowGroup

Question

我目前在我的项目中使用 AG GRID，并且已经为其中一列实现了 RowGroup 功能，

这是我的代码： HTML

    <div id="myGrid" style="height: 400px;width:80%; display:none" class="ag-theme-alpine">
    </div>

JS:

     var gridOptions_PortCd = {
        suppressClickEdit: true,
        columnDefs: [
           { headerName: "Col1", field: "Col1", rowGroup: true, hide: true },
           
            { headerName: "Val1", field: "val2", minWidth: 200 },
            
        ],
        defaultColDef: {
            sortable: true,
            filter: true,
            resizable: true,
        },
        autoGroupColumnDef: {
            headerName: 'ColA',
            minWidth: 200,
        },
        groupDisplayType: 'singleColumn',
        animateRows: true,
    };

我能够为网格提供一些 JSON 数据，而且一切看起来都很棒（我不包括其余代码，因为我认为它与问题无关）。

现在发生的事情是，网格看起来非常棒，但是我希望能够在我的网格中设置 rowGroup 行的样式，因为它是黑色的，我希望它只是纯白色。

这是我的样子：

mygrid

抱歉，只有 link（所以不允许我粘贴图像）。

本质上，如何将 ROW GROUP 的 COLOR 设置为不同的东西，我已经尝试过类似的东西：

.ag-theme-alpine .ag-row.ag-row-level-0 {
    background-color: #dddbdb!important;
}

但这不起作用。我不确定为什么它显示为海军蓝色而不是纯白色或灰色或其他颜色，但我希望能改变它。有什么指点吗？

目标是让它看起来像这样（在 AG GRID 网站示例中）

Example

我查看了 AG GRID 网站的文档，但他们没有提供如何设置样式的信息。

编辑：我是这样改的，现在看起来像这样：

 .ag-cell {
    background-color: yellow !important;
}

updated

Answer 1

如果你想改变行组中单元格的颜色，尝试使用：

 .ag-cell {
        background-color: #dddbdb !important;
    }

结果：

更新：

尝试更改ag-cell-wrapper的背景颜色：

 .ag-cell-wrapper {
            background-color: #dddbdb !important;
        }

结果：

Style AG Grid 的 rowGroup

Style AG Grid's rowGroup

javascript

css

ag-grid

asp.net-core