div
для спрайта большого изображения в качестве фона. Так было до того момента, пока я не услышал доклад на Smashing Conference от MikeRiethmuller под названием «За пределами медиазапросов». Кроме того, я настоятельно рекомендую прочитать его же статью «Большой потенциал SVG».
Я узнал две вещи, которые меня потрясли:
- При использовании SVG вы можете отказаться от атрибута
viewBox
и установить новую систему координат на вложенных элементах SVG путем применения новогоviewBox
. (Да, я знаю. Это звучит странно. Ниже я объясню все более подробно). - Когда вы используете медиазапросы внутри SVG-файлов, а затем вставляете изображение через тег img или в качестве фонового изображения CSS, медиазапросы привязаны к ширине изображения. Практически такое же поведение, как и при использовании контейнерных запросов.