如何将 textTransform 设置为全局所有组件？

Question

我想将我的 muiv5 项目中的所有文本都大写。除非在sx 中声明或在组件本身上设置样式，否则它应该默认为大写。

我试过的是：

<ThemeProvider theme={theme}>
    <IntlProvider
        locale="en"
        defaultLocale="en"
        messages={AppLocale.en.messages}
    >
        <CssBaseline />
        <GlobalStyles styles={{ root: { textTransform: "capitalize" } }} />
        <Component {...pageProps} />
    </IntlProvider>
</ThemeProvider>

但它不起作用。有什么最好的方法吗？甚至 createTheme 也不适合我。

注意：我不想使用makeStyles。使用 Next.js。

Answer 1

您可以允许body 的所有子代继承textTransform 值。

<GlobalStyles styles={{ body: { textTransform: "capitalize" } }} />