Блог

Главная - Вопросы по программированию - Типография Material UI v4: избыточные правила CSS, переопределяющие мою пользовательскую тему

Типография Material UI v4: избыточные правила CSS, переопределяющие мою пользовательскую тему

#css #reactjs #material-ui #typography

#css #reactjs #материал-пользовательский интерфейс #типография

Вопрос:

В моей теме Material UI я определил стили для каждого варианта:

 const theme = createMuiTheme({
    palette: {
        primary: {
            main: "#1dc0d7",
        },
        secondary: {
            main: "#c9c9c9",
            dark: "#505255",
        },
    },
    typography: {
        allVariants: {
            color: "#505255",
        },
        body1: {
            fontSize: '1em',
        },
        body2: {
            lineHeight: 1.25,
        },
        subtitle2: {
            fontWeight: 'bold',
        },
        h1: {
            fontSize: '2.4em',
        },
        h6: {
            fontSize: '1.25em',
        },
    },
});

Однако по какой-то странной причине мое правило CSS варианта «h1» переопределяется другим правилом, и я понятия не имею, откуда оно взялось:

Скриншот

Есть идеи?

Комментарии:

1. может быть много причин. вы правильно настроили ThemeProvider? ссылка: material-ui.com/customization/theming/#theme-provider затем проверьте, как вы настроили стили для компонентов. возможно, ваш компонент переопределяет стили. ссылка: material-ui.com/styles/advanced/#overriding-styles-classes-prop

2. Спасибо @MrClemRkz, я посмотрю

3. конечно. может легко помочь, если вы поделитесь частью кода, которая воспроизводит ту же проблему, которую вы нашли, через codesandbox.io .