Как сделать изображение с образованием фонового изображения в материальном интерфейсе ⇐ CSS

[Anonymous]

Я пытаюсь решить проблему с моим фоновым изображением, когда изменяю размер браузера. У меня есть высота фонового изображения в моем приложении на «100VH», которая заполняет всю страницу. Когда я изменяю размер браузера до меньшей ширины, фоновое изображение отрезается. Изменение высоты на «100%» исправляет это, когда страница отзывчива, но на 100% показано, что изображение отключено, когда я вернулся к обычным размеру рабочего стола, потому что она заполняет только фон размер Div. < /P>

Я использую пользовательский интерфейс материала. Как бы я поступил на ответственное изменение размера фонового размера?return
< /code>

css < /b> < /p>

content: {
flexGrow: 1,
padding: theme.spacing(3),
height: '100vh',
textAlign: 'center',
backgroundImage: `url(${Background})`,
backgroundRepeat: "no-repeat",
backgroundPosition: "center center",
backgroundSize: "cover",
backgroundAttachment: "fixed",
},
< /code>

Я попытался добавить это в свой класс в стиле контента, но это не имело значения < /p>

[theme.breakpoints.down('lg')]: {
height: '100%'
}
< /code>

Есть предложения? Спасибо

Подробнее здесь: https://stackoverflow.com/questions/565 ... aterial-ui