CSS Анимация за 6 минут. Animation при наведении в CSS3/HTML

Исходный код Анимации - http://bit.ly/2on1XXz Красивая #анимация блока с #картинкой сделанная на чистом #CSS. Без труда сможете внедрить такой эффект на любой #сайт. При наведении на блок мы скроем картинку и покажем на переднем плате текст. Структура каркаса сделана на блоках div в #HTML, в принципе в простой и понятной форме.Вся #animation написана буквально в пару строк в #CSS3. Задействуем в CSS: • #псевдоклассы #:before и #:after • используем пересечение цветов при помощи mix-blend-mode: darken; • элементы анимируем при помощи #transform и #transition Обсуждение видео: https://youtu.be/9ptcEEyE3aY Подписка на канал: https://dwstroy.ru/~dwstv Видео сборник: https://dwstroy.ru/~S126H *Видео метки*: [00:30] - Делаем основной каркас блока в index.php [01:30] - Описываем стили в #CSS3 [02:49] - Псевдоклассы #:before и #:after [03:58] - Анимирование при помощи transform и transition *Другие видео на канале DWSTV*: Сайт с нуля - https://dwstroy.ru/~7KNnM Уроки по #CSS - https://dwstroy.ru/~paoBU 1С Битрикс работа с сайтом - https://dwstroy.ru/~dEG4q Управление системой Битрикс - https://dwstroy.ru/~Zdt4K Настройки сайта 1С Битрикс - https://dwstroy.ru/~t0UVZ Во время урока я использую: Документацию по #CSS3 Редактор #PhpStorm Ссылки из урока: Архив с урока - https://dwstroy.ru/~oDHzr CSS анимация (исходный код) - https://dwstroy.ru/~7CUbG Использую музыку: Aero Chord - Time Leap [NCS Release] https://www.youtube.com/user/NoCopyrightSounds http://soundcloud.com/nocopyrightsounds Добавляйтесь к нам в друзья: Сайт видео-уроков: https://dwstroy.ru/video/ Канал в VK автора уроков: https://vk.com/dwstv Канал группы в VK: https://dwstroy.ru/~MJM28 Мы очень рады если видео по #CSS3 #animation было Вам полезно, хотите "поблагодарить" жмите кнопку "нравится" и скиньте ссылку на урок друзьям. Это и есть самая лучшая благодарность, а также мотивация продолжать записывать обзоры и видео-уроки как по CSS, так и другим #WEB разработкам.