如何删除 React AgGrid .ag-root-wrapper 上的边框样式

Question

我无法删除边框样式。
我要移除的属性如下

border: solid 1px <<

而且，我尝试了 css 文件。

.ag-root-wrapper {
    border: 0px solid transparent;
}

此代码无效。
但是，如果您通过 Chrome 开发者模式删除该属性，则可以删除边框。

ps。我想上传问题图片。
但我不能。 （您需要至少 10 个声誉才能 post 图片。）

已添加详细来源。

default.css

.ag-root-wrapper {
    border: none // not working
    // display: none // working!!
}

agGrid

import React from 'react';
import 'default.css';
import {AgGridColumn, AgGridReact} from 'ag-grid-react';
import 'ag-grid-community/dist/styles/ag-grid.css';
import 'ag-grid-community/dist/styles/ag-theme-alpine.css';

export default function Example(props) {
    return (
        <div 
            className="ag-theme-alpine" 
            style={{height: "calc(100vh - 48px)", margin: "10px",
            width: "100%"}}>
            <AgGridReact
                defaultColDef={{
                    minWidth: 100,
                    resizable: true
                }}
                colResizeDefault={'shift'}
                rowSelection={'single'}
                onGridReady={onGridReady}
                onSelectionChanged={onSelectionChanged}
                rowData={data}>
                <AgGridColumn field="cateId" width={20}/>
                <AgGridColumn field="sort" width={30}/>
                <AgGridColumn field="isUsed" width={30}/>
                <AgGridColumn field="title" width={260}/>
                <AgGridColumn field="explanation" width={500}/>
                <AgGridColumn field="gitHubUrl" width={400}/>
                <AgGridColumn field="markdownUrl" width={700}/>
            </AgGridReact>
        </div>
    );
};

Answer 1

如果你像这样指定 .ag-theme-alpine 它应该可以工作:

.ag-theme-alpine .ag-root-wrapper  {
    border: none;
}