Каким способом адаптировать фоновые изображения блоков подобные этим?

Question

[Please2334]

Тоесть как адаптировать цельные фоновые изображения отдельных блоков понятно, но как адаптировать подобные "одиночные" фоновые элементы? Как вы адаптируете подобные элементы?

Comments

[Антон Антон]

разный фон на разную ширину не предлагать? а то на картинке со стиралкой похоже что именно так

[Вадим]

Антон Антон, разве? По-моему там просто 2 картинки. Стиралка и фон под стиралкой.

Please2334, Но независимо от вышесказанного, разные картинки, с точки зрения файлов, под разные разрешения - это правильное предложение. Так как незачем телефону грузить более тяжёлую десктоп картинку.
А в чём вопрос - не понятно. Ну вот есть 2 картинки. На десктоп у фона одни стили, на мобилке через медиазапрос другие. То есть другой background-posiiton и size. Вы же про множественные фоны знаете, да?

[Антон Антон]

Вадим, ну как минимум то, что под стиралкой, повернуто по разному. + положение "звездочки", которая над стиралкой - разное относительно стиралки. т.е. возможно это три слоя бэкграунда, частично разные на разной ширине. А возможно просто две картинки.

Answer 1

[Машка]

Цветной фон можно добавить на абсолютно позиционированный before. При изменении расширения на мобильное before поворачивается с помощью
transform: rotate(-0.25turn)
А так же меняется его положение относительно родителя.