小编Sco*_*ott的帖子

使用 Material UI DataGrid，表格中的默认字体太小，看不清文本。

我的代码实际上是他们在页面上演示的复制/粘贴：

https://material-ui.com/components/data-grid/

我的表格中的字体很小。页面的其余部分不使用 Material UI（菜单等）都可以。在 Firefox 开发工具 Inspector 中我看到

继承自div： .MuiDataGrid-root { font-size: 0.875rem; }

在浏览器工具中将其更改为 10px 之类的值，或完全禁用它，确认这就是需要更改的值。编译时它会自动添加到末尾（内联），因此它会覆盖我以前的样式。愚蠢的是，我找不到在哪里添加它。

我查看了几个使用同一张表作为示例的网站，但没有一个网站存在此问题。有人可以告诉我在哪里看，如何修复默认字体大小不正确的表格吗？

我有这些相关的内容：

包.json：

"@material-ui/core": "^4.11.0",
"@material-ui/data-grid": "^4.0.0-alpha.6",
"fontsource-roboto": "^3.0.3",

索引.html

<meta name="viewport" content="minimum-scale=1, initial-scale=1, width=device-width" />

缩写的 .jsx 代码：

import React from 'react';
import { DataGrid } from '@material-ui/data-grid';

const DemoTableMui = () => {
...

 const columns = [{ field: 'id', headerName: 'ID', width: 70 } ]
 const rows = [{ id: 1, lastName: 'Smith', firstName: 'Jon', …