Адаптация изображения под мобильные устройства! html
Суть заключается в том, что почему-то при открытии сайта через телефон, то он у меня растягивает большое изображение и получается что на сайте кусочек большого изображения. Хочу сделать что бы была специальная картинка для мобильного устройства, но что-то у меня с этим не растет!
<div class="w-slider-mask">
<div class="hero-slide w-slide"><img src="file\imagehome\image home 1.1.jpg" sizes="100vw" srcset="file\imagehome\image home 1.1.jpg 1080w, file\imagehome\image home 1.1.jpg 1600w, file\imagehome\image home 1.1.jpg 1920w" alt="" class="hero-img"></div>Ответы (1 шт):
Автор решения: demid.gromiko
→ Ссылка
попробуй сделать так: (где я написал 600px можешь другое значение поставить, это влияет на то при какой ширине картинка будет менятся на другую.)
.img_pc{
display:block;
}
.img_mobile{
display:none;
}
@media only screen and (max-width: 600px) {
.img_pc{
display:none;
}
.img_mobile{
display:block;
}
}