javascript - 将单词中的第一个字母大写表示正常状态

Question

• 我正在尝试覆盖 Material UI css。
• 我试着把这两个词都大写，但它只在选中和悬停时发生变化，
• 是否也可以在正常状态下更改它
• 我进行了调试但无法找到问题。
• 你能告诉我如何解决吗？
• 在下面提供我的代码片段和下面的沙盒。

https://codesandbox.io/s/2pomwq2z20

const styles = theme => ({
  root: {
    flexGrow: 1,
    width: "100%",
    backgroundColor: theme.palette.background.paper
  },
  tabsIndicator: {
    backgroundColor: "red",
    textTransform: "capitalize"
  },
  tabRoot: {
    "&:hover": {
      color: "red",
      opacity: 1,
      textTransform: "capitalize"
    },
    "&$tabSelected": {
      color: "red",
      fontWeight: theme.typography.fontWeightMedium,
      textTransform: "capitalize"
    },
    "&:focus": {
      color: "red",
      textTransform: "capitalize"
    }
  },
  tabSelected: {}
});

Answer 1

你需要在tabRoot中添加textTransform: "initial"。查看https://codesandbox.io/s/p5z9m029v0