javascript - Material UI typography setting is not working on default Box element

Question

I'm using Materail UI 4.11. I have create my own theme with typograph:

...
createMuiTheme({
    typography: {
        fontFamily: ["Work Sans", "sans-serif"].join(","),
        fontSize: 16,
        fontWeightLight: 300,
        fontWeightRegular: 400,
        fontWeightMedium: 500,
    },
})

This working well on the default Button style, I do not need to add extra font size and font family style if I want to use the default one. However, it's not working on the Box element. If I want to apply the style to the default Box, I set it: <Box component="div" fontSize="fontSize" fontFamily="fontFamily">Box</Box>.

Why the Box cannot load the default typography style without setting fontSize and fontFamily, like <Box component="div">Box</Box ? Do I need to create my own Box with the default typography style?

question from:https://stackoverflow.com/questions/66056409/material-ui-typography-setting-is-not-working-on-default-box-element

Answer 1

Waitting for answers