CSS3 flexbox практика | Эффект при наведении в CSS
Исходный код с картинками - http://bit.ly/2zgpG2F
Шпаргалка по #EMMET - http://bit.ly/2zwDk1p
В текущем уроке поработаем с изображениями. При помощи #transform и #transition, сделаем по наведению следующую анимацию, изображение немного повернем, увеличим его в размерах, и сделаем его немного бесцветным. С левой стороны будут выезжать два блока с текстовой информацией. В нижней части появляется блок с иконками, которые подключим через сайт #font-awesome. По наведению на иконку сделаем им индивидуальный цвет. Для иконок задействуем #flexbox. Также все блоки будут адаптивны, и подстраиваются под разные форматах экранов. Все это реализуем на #flex #box и #медиа #запросах. Для материальной поддержки канала: WMR - R165181087249 WMZ - Z138569415925 PayPal - paypal.me/dwstv Яндекс - 410011610186118 Сбербанк - 4276-3000-2291-1211 Во время урока я использую: Документацию по #CSS3, HTML5 Редактор #PhpStorm *Видео метки*: [01:08] - Обзор урока [01:53] - Html структура блоков [04:27] - Устанавливаем иконки [06:12] - Cтили оформление изображения [09:15] - Позиционирование текста [10:51] - Добавляем динамуку для картинки [11:32] - Оформляем иконки [15:34] - Адаптируем при помощи flexbox [18:44] - Адаптируем при помощи @media [23:37] - Проверяем результат Обсуждение видео: • CSS3 flexbox практика | Эффект при наведен... Скачать архив с урока - https://goo.gl/nk1WuJ
Скачать картинки - https://goo.gl/wcSphu
Урок по плагину EMMET - • Как научиться быстро верстать? | Плагин EMMET Подписка на канал: https://dwstroy.ru/~dwstv
Видео сборник: https://dwstroy.ru/~S126H
*Другие видео на канале DWSTV*: JavaScript Основы - http://bit.ly/2udeTq3
Сайт с нуля - https://dwstroy.ru/~7KNnM
Уроки по #CSS - https://dwstroy.ru/~paoBU
1С Битрикс работа с сайтом - https://dwstroy.ru/~dEG4q
Управление системой Битрикс - https://dwstroy.ru/~Zdt4K
Настройки сайта 1С Битрикс - https://dwstroy.ru/~t0UVZ
Добавляйтесь к нам в друзья: Сайт видео-уроков: http://dwsttv.ru/
Канал в VK автора уроков: https://vk.com/dwstv
Канал группы в VK: https://dwstroy.ru/~MJM28
Мы очень рады если видео "#CSS3 #flaxbox #практика | #Эффект при #наведении в #CSS" было Вам полезно, хотите "поблагодарить" жмите кнопку "нравится" и скиньте ссылку на урок друзьям. Это и есть самая лучшая благодарность, а также мотивация продолжать записывать обзоры и видео-уроки как по CSS, так и другим #WEB разработкам.
