如何更改树景的字体尺寸和颜色？

发布于 2025-01-23 07:17:15 字数 713 浏览 0 评论 0原文

给出这样的样式：

const style = {
  overflow: "auto",
  backgroundColor: "#292929",
  color: "blue",
  height: 650,
  width: 1,
  flexGrow: 1,
  fontFamily: "Segoe Print",
  fontSize: 30
};

然后像

const MyTw = () => (
  <TreeView
    aria-label="file system navigator"
    defaultCollapseIcon={<ExpandMoreIcon />}
    defaultExpandIcon={<ChevronRightIcon />}
    sx={style}
    multiSelect={true}
  >
);

”不会改变字体系列和大小。我想念什么？实时示例：

https：//codesandbox.io/s/s/ smoosh-grass-c3zohz？file =/src/app.js

原文

Give style like this:

const style = {
  overflow: "auto",
  backgroundColor: "#292929",
  color: "blue",
  height: 650,
  width: 1,
  flexGrow: 1,
  fontFamily: "Segoe Print",
  fontSize: 30
};

then used like in TreeView:

const MyTw = () => (
  <TreeView
    aria-label="file system navigator"
    defaultCollapseIcon={<ExpandMoreIcon />}
    defaultExpandIcon={<ChevronRightIcon />}
    sx={style}
    multiSelect={true}
  >
);

it doesn't change the font family and size. What am I missing? live example:

https://codesandbox.io/s/smoosh-grass-c3zohz?file=/src/App.js

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

妄司 2025-01-30 07:17:15

我修改了您的样式代码，因此字体和尺寸将按照您想要显示。
这是您可以尝试的代码段：

const style = {
  overflow: "auto",
  backgroundColor: "#292929",
  color: "blue",
  height: 650,
  width: 1,
  flexGrow: 1,
  "& .MuiTreeItem-label": {
    fontFamily: "Segoe Print",
    fontSize: 30,
  }
};

字体和尺寸将就像您的设置一样。

I revised your style code so the font and size will display as you wanted.
Here is the code snippet you can try:

const style = {
  overflow: "auto",
  backgroundColor: "#292929",
  color: "blue",
  height: 650,
  width: 1,
  flexGrow: 1,
  "& .MuiTreeItem-label": {
    fontFamily: "Segoe Print",
    fontSize: 30,
  }
};

The font and size will be like your setting.