调整 Material UI Icon 高度的最佳实践

Question

我将 Material UI Icons 中的两个图标排成一行。高度本身相同：24px。但路径的高度不同。一个是 18px，另一个是 22px。他们看起来不酷。

如何调整高度？我的意思是“用户看到的高度”。

import {
  Delete,
  FileCopy
} from "@material-ui/icons";

...

<Box display="flex">
  <FileCopy onClick={handleCopy} />
  <Delete onClick={handleDelete} />
</Box>

我尝试设置 SVG 的高度，它使垂直对齐变得丑陋......

Answer 1

图标有一个fontSize属性 - 例如<HomeIcon fontSize="large" />。

您还可以显式设置它 - <DeleteIcon style={{fontSize: "10px"}}/>。