#webdevhouse
#html_css
#для_начинающих
Мы в ВК: https://vk.com/webdevhouse
Мы в Telegram: https://t.me/webdevhouse
Эпизоды:
00:00 Начало
02:51 Разбор кнопок
41:58 Разбор первой части форм
02:12:52 Разбор второй части форм
02:54:35 Разбор дроп-меню
03:38:17 Разбор бургер меню
Привет! В этом видео разобрали несколько видов элементов из которых состоит сайт, поработали с кнопками, сверстали форму, в которой стилизовали checkbox и радио кнопки, сделали многоуровневое выпадающее меню, меню бургер и всё это только на HTML5 и CSS3
Что использовали:
– display: flex, block, none;
– flex-direction: column;
– position: relative, absolute;
– ::before
– ::after
– :hover
– :checked
– Комбинаторы "+" и "~", селекторы вида tag{}, .element .element__child{}, .element .element__child и их вариации
– :last-child
– transform: scale() rotate();
– transition
Что сделано:
1. Сетка из кнопок разного вида
2. Форма
2.1 Стилизованы input и подписи к ним
2.2 Стилизован тег select
2.3 Стилизован checkbox
2.4 Стилизованы радио кнопки
2.5 Настроена работа checkbox, радио кнопок и добавлены анимации
3. Выпадающее меню
3.1 Стилизован основной уровень
3.2 Стилизованы дочерние уровни
3.3 Настроена работа выпадающего меню и анимации
4. Меню бургер
4.1 Стилизована шапка
4.2 Стилизован сам бургер
4.3 Стилизован выпадающий контейнер с элементами меню
4.4 Настроена работа меню и анимации
Макет в Figma https://cloud.mail.ru/public/4qqB/5gh...