Блог

Главная - Вопросы по программированию - Возможно ли для Img srcset в фоновое изображение?

Возможно ли для Img srcset в фоновое изображение?

#html #css #responsive-design #background-image

#HTML #css #адаптивный дизайн #фоновое изображение

Вопрос:

У меня есть адаптивный раздел заголовка, но мне нужно перенести изображение из <img> тега в background-image — возможно ли это?

Ниже приведен текущий img тег:

 <img src="img/images-header.jpg"
     srcset="img/images-header@2x.jpg 2x,
             img/images-header@3x.jpg 3x"
     class="Images-Header">

И CSS — это

 .Images-Header {
  width: 320px;
  height: 456px;
  margin: 60px 0 0;
  padding: 105px 29px;
  object-fit: contain;
}

В принципе, мне нужно, чтобы изображение отображалось на разных устройствах, возможно ли использовать srcset в фоновом изображении или с тем же эффектом?

Большое спасибо,

Ответ №1:

Нет, это невозможно. Но вы можете использовать медиа-запросы для загрузки разных версий / размеров вашего фонового изображения в зависимости от размеров экрана или других параметров @media, таких как соотношение пикселей или аналогичных.

Комментарии:

1. Спасибо, Йоханнес! Я могу это сделать, но я не уверен, как тогда наложить текст! Большое спасибо!

2. что вы имеете в виду, как наложение текста связано с фоновыми изображениями?

3. Извините, я говорил слишком рано — я разобрался с этим 🙂

Метки: