#11 Вёрстка сайта визитки для начинающих | HTML, CSS, JS - CSS header. Фильтры для background
Сегодня познакомимся с фильтрами в css и попрактикуемся в их использовании!
Поддержать канал:
https://www.tinkoff.ru/rm/shevchuk.vi...
https://www.donationalerts.com/r/webp...
Подписывайтесь и ставьте лайк, приятного просмотра!
Также обязательно подпишись на мой телеграм канал, там будет много общения и ответов на вопросы!
https://t.me/webpacman
------------------------------------------------
Ссылки:
Код в GitHub: https://github.com/webpacman/webpacma...
Код урока: https://github.com/webpacman/webpacma...
GitHub Pages: https://webpacman.github.io
Фильтры: https://developer.mozilla.org/ru/docs...
Тайминг:
00:00 - Введение и проблематика
01:07 - Создаём обёртку (layout) для затемнения
01:58 - inherit значение из родительского элемента
02:20 - Позиционируем обёртку
03:32 - css z-index приоритет отображения
06:03 - css filter эффекты
06:29 - Исправляем ошибку phpstorm: requested without authorization
07:06 - Возвращаемся к свойству filter. Осветление с помощью brightness
07:41 - Выносим картинку в отдельный HTML элемент
09:13 - css object-fit заполнение блока картинкой или видео
10:16 - filter blur размытие
10:38 - filter contrast чёткость цвета
10:58 - filter drop-shadow тень
11:38 - filter grayscale оттенки серого
11:47 - filter hue-rotate изменение оттенка
11:54 - filter invert инвертирование цвета
12:02 - filter opacity непрозрачность
12:55 - revert сброс свойства до начального состояния
13:03 - filter saturate насыщенность цвета
13:30 - filter sepia
14:11 - Завершение и сохранение кода в git
Музыка:
Dead Pacman by N3rgul
Track: Falling — Declan DP [Audio Library Release]
Music provided by Audio Library Plus
Watch: • Falling — Declan DP | Free Background...
Free Download / Stream: https://alplus.io/falling-declan-dp
------------------------------------------------
Привет! Меня зовут Виталий Шевчук, я веб-разработчик. Свой путь в разработке сайтов я начал ещё в школе, создавая форумы для игр. К текущему времени я получил много опыта в разработке сайтов и очень хочу им поделиться с вами!
------------------------------------------------
Telegram: https://t.me/webpacman
Сайт: http://vshevchuk.ru/
Теги: #html #html5 #верстка #css #css3 #css3tutorial