Я хочу растянуть фоновое изображение (SVG, который может быть не таким большим, как его контейнер), чтобы растянуть или сжать до 100% ширины контейнера и 100% высоты контейнера.
Если мы иметь фоновое изображение, которое уже, чем его контейнер:
background-image: url("../img/sky-gradients-01.svg");
background-repeat: no-repeat;
Я хочу что-то, что работает аналогично
object-fit: fill
правило CSS, которое «растягивает изображение, чтобы оно соответствовало содержанию. box, независимо от его соотношения сторон ".
Я пробовал:
/* stretches to fit the width, but maintains the aspect ratio, clipping the bottom */
background-size: 100%;
/* fits the height, but maintains the aspect ratio, leaving space at the both sides */
background-size: 100% 100%;
/* fits the height, but maintains the aspect ratio, leaving space at one sides */
background-size: contain;
/* stretches to fit the width, but maintains the aspect ratio, clipping the bottom */
background-size: cover;
/* original image size, space at sides and possibly bottom */
background-size: auto;
Во всех случаях все параметры фона сохраняют соотношение сторон. Есть ли варианты, которые подойдут без учета соотношения сторон?