Адаптивное изображение, набор параметров и размеры

Я начинаю использовать отзывчивое изображение и немного сомневаюсь.

У меня есть иконка. У этого значка на моем веб-сайте всегда два размера: маленькая версия, ширина 74 пикселя, и большая версия, ширина 94 пикселя.

<img alt="Sezione Gino" style="background-color: #dd0505" srcset="https://website.imgix.net/system/uploads/section/icon/1/immuni_t.jpg?ixlib=rails-4.0.0&amp;w=94&amp;h=72&amp;fit=crop&amp;sizes=94px&amp;auto=format%2Ccompress&amp;dpr=1&amp;q=75 1x,
https://website.imgix.net/system/uploads/section/icon/1/immuni_t.jpg?ixlib=rails-4.0.0&amp;w=94&amp;h=72&amp;fit=crop&amp;sizes=94px&amp;auto=format%2Ccompress&amp;dpr=2&amp;q=50 2x,
https://website.imgix.net/system/uploads/section/icon/1/immuni_t.jpg?ixlib=rails-4.0.0&amp;w=94&amp;h=72&amp;fit=crop&amp;sizes=94px&amp;auto=format%2Ccompress&amp;dpr=3&amp;q=35 3x,
https://website.imgix.net/system/uploads/section/icon/1/immuni_t.jpg?ixlib=rails-4.0.0&amp;w=94&amp;h=72&amp;fit=crop&amp;sizes=94px&amp;auto=format%2Ccompress&amp;dpr=4&amp;q=23 4x,
https://website.imgix.net/system/uploads/section/icon/1/immuni_t.jpg?ixlib=rails-4.0.0&amp;w=94&amp;h=72&amp;fit=crop&amp;sizes=94px&amp;auto=format%2Ccompress&amp;dpr=5&amp;q=20 5x" sizes="94px" src="https://website.imgix.net/system/uploads/section/icon/1/immuni_t.jpg?ixlib=rails-4.0.0&amp;w=94&amp;h=72&amp;fit=crop&amp;sizes=94px&amp;auto=format%2Ccompress">

Я создал с помощью imgix этот srcset для большого значка. Я проверяю изображения, и они меняют размер правильно: 1x - ширина 94 пикселя, 2x - ширина 188 пикселей.

Я установил размер 94, потому что в большой версии изображение всегда 94px.

Теперь мой вопрос: для версии с 74 пикселями, поэтому для маленького значка я должен воссоздать набор с размером 74 пикселей?

1 ответ

Да, вам придется воссоздать набор.

Если это один и тот же значок, вы можете просто скопировать, вставить и заменить w=94 с w=74, хотя вам также может потребоваться отрегулировать высоту, чтобы изображение не искажалось.

Другие вопросы по тегам