Адаптивные изображения. Практические приемы верстки картинок. CSS object-fit HTML picture.

Адаптивные изображения. Практические приемы верстки картинок. CSS object-fit HTML picture. Продолжаем изучать работу с изображениями и сегодня поговорим о важной теме - адаптив изображений. Изучим CSS свойства object-fit и object-position и HTML теги picture и source. Рассмотрим практические примеры правильного адаптива картинок в разных ситуациях.

Содержание:
00:00 - Вступление
01:10 - Метод max-width
06:23 - CSS object-fit и object-position
14:13 - HTML тег picture

👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками!

🤟 Живи, а работай в свободное время! ©

[eylcvzn]

Я занимаюсь совершенно другими вещами, но ставлю лайк! За труд и бесплатное обучение! У тебя классный контент! Ты лучший!

[heorhiizaragul]

Лайк, за: object-fit, не знал про это свойство, а оно очень меня выручило! Спасибо тебе за твой труд, ты крутой, чувак!!

[kirillriman]

Круто, не знал про object-fit и picture-source
Божественный гайд :)

[stivem]

Пересмотрел несчетное кол-во каналов за год+, как по верстке так и др. Но только тут настолько все круто и понятно и мотивация+++, что я наконец-то сверстал пару своих тренировочных макетов! Вновь поверил в себя! Мне очень трудно дается эта сфера.. ну прям ваще все туго даже самое банальное(( но я пытаюсь и не останавливаюсь!!! Спасибо Вам бесконечно огромнейшее Евгений!! Надеюсь когда-нить хватит знаний уже и выйти на фриланс наконец-то!!

[perpetuummobile]

Долго хотел начать изучать frontend разработку, но после того, как нашел видео уроки понял, что пора. Тем более, что Женя так классно и понятно объясняет. (Посмотрел его работы на веблансе, это просто афигенно) Этот канал обязательно наберёт 1кк🍋 подписчиков

[annagrigorewa]

Поставила лайк раньше, чем начались помехи)))) Женя, как всегда..видео - огонь! Спасибо тебе!!! Очень помогаешь в моей работе)

[anatolys]

Супер классный туториал, впрочем как и всегда! шикарная подача! спасибо огромное! дай Бог тебе здоровья, удачи и творческих успехов )))

[qbexhvp]

Это магия! Спасибо огромное за знания, которыми Вы с нами поделились! Это мега круто:)

[rxvbwbs]

Качественно, полезно, информативно! Спасибо!

[portvein]

Очень интересно учиться благодаря твоим видео.Спасибо за такую возможность!)

[mexvision-]

Оу, хорошее свойство о котором я не знал) Спасибо! Лайк и подписка уже оформлены)

[romartynromashka]

Наконец-то! Ни в одной про теги picture\source я не нашёл упоминание атрибута media, а вот теперь у меня всё заработало, как надо!

[lzobgjp]

Огромное спасибо тебе, добрый человек! Очень ценные знания представил очень просто и понятно, СПАСИБО!!!

[alexeydoshchenko]

Пушка! Не слежу за новыми свойствами, для меня это открытие)

[natalyaanfilofyeva]

Огромное спасибо! Всегда так четко и понятно!

[wellemangrey]

Давно искал такие объяснения. Спасибо!

[jitrixjitrix]

Ну наконец файлы урока есть, так бы всегда было :) А за урок спасибо большое, всегда на высоте!

[gfefrdn]

Просто супер-бомба урок! Я мучился с адаптивом картинок как мог, а теперь все ясно и понятно. Честь тебе и хвала, Евгений!

[TakuatChanel]

Твои видео просто клондайк знаний по фронтенду, благодаря твоим четко структурированным видосам с отличным монтажем многим не нужно собирать информацию по крупицам. Спасибо что ты есть, мужик)

[BLGamesChannel]

Отлично, взял на заметку пару приемов!) Теперь у меня с изображениями будет куда меньше проблем! Спасибо в очередной раз!)