如何样式化react-admin Datagrid的头部？

import React from 'react';
import { Datagrid, TextField } from 'react-admin';
import './datagridHeader.css'; // 导入自定义的CSS文件

const CustomDatagridHeader = (props) => (
    <div className="custom-datagrid-header">
        <TextField source="id" />
        <TextField source="name" />
        {/* 添加更多表头字段 */}
    </div>
);

const MyList = (props) => (
    <List {...props}>
        <Datagrid
            header={<CustomDatagridHeader />} // 使用自定义的头部组件
        >
            <TextField source="id" />
            <TextField source="name" />
            {/* 添加更多数据字段 */}
        </Datagrid>
    </List>
);

export default MyList;

.custom-datagrid-header {
    /* 添加自定义的样式 */
    background-color: #f0f0f0;
    color: #333;
    font-weight: bold;
    /* 添加更多样式 */
}