Pobrać "CSS Анимация картинки при наведении / работаем с :before и :after"

Исходный код - https://dwstroy.ru/video/azbuka-ot-a-do-css/css-animatsiya-kartinki-pri-navedenii-tutorial-css3/ В данном видео поделюсь как можно красиво при помощи #transform и #transition, а также задействуем #псевдоэлементы #:before и #:after. В се это реализуется на чистом #CSS #HTML. Картинку расположим по центру экрана, при наведении увеличим ее с небольшим поворотом и эффектом размытия, а при помощи псевдоэлементов #before, #after, задаем затемнения с анимацией появления текста. Заголовок появляется с заднего фона, а параграф с переднего. Зададим кнопке блик, и в конечном итоге получится красивая анимация. Все это реализуем на чистом #CSS3, и в уроке задействуем: • Псевдоэлементы :before и :after • Расположим элементы при помощи #position • А для анимации воспользуемся transform и transition Обсуждение видео: https://www.youtube.com/watch?v=ofcqdcLP5qM Подписка на канал: https://www.youtube.com/channel/UCTgx8cZRD5Jz2_zGaT27S3w?sub_confirmation=1 Видео сборник: https://www.youtube.com/channel/UCTgx8cZRD5Jz2_zGaT27S3w/videos *Видео метки*: [01:51] - html разметка [05:25] - Этапы описания стилей #CSS3 [07:54] - Псевдоэлементы #:before и #:after [12:44] - Анимирование при помощи transform и transition *Другие видео на канале DWSTV*: Сайт с нуля - https://www.youtube.com/playlist?list=PL8pp2EAvIK-LaGLDQtIF2EF1N3FWUUudR Уроки по #CSS - https://www.youtube.com/playlist?list=PL8pp2EAvIK-LQgy4sgJE6zxabsIyYQAWi 1С Битрикс работа с сайтом - https://www.youtube.com/playlist?list=PL8pp2EAvIK-I0xR27pENyHigGzoJEDIO- Управление системой Битрикс - https://www.youtube.com/playlist?list=PL8pp2EAvIK-JyvOtAVyea1ohbV1XJyTkX Настройки сайта 1С Битрикс - https://www.youtube.com/playlist?list=PL8pp2EAvIK-L95LYyIL0H6gYGFfaR3AJ- Во время урока я использую: Документацию по #CSS3 Редактор #PhpStorm Добавляйтесь к нам в друзья: Сайт видео-уроков: https://dwstroy.ru/video/ Канал в VK автора уроков: https://vk.com/dwstv Канал группы в VK: https://dwstroy.ru/~MJM28 Мы очень рады если видео по #CSS3 #animation было Вам полезно, хотите "поблагодарить" жмите кнопку "нравится" и скиньте ссылку на урок друзьям. Это и есть самая лучшая благодарность, а также мотивация продолжать записывать обзоры и видео-уроки как по CSS, так и другим #WEB разработкам.