HTML и CSS - полный курс по вёрстке с нуля

Программа курса

Ознакомьтесь с программой курса «HTML и CSS - полный курс по вёрстке с нуля» от PurpleSchool - purpleschool.ru

1. Введение. HTML и CSS, Как устроен курс, Обзор проектов, Обзор курсов, Работа на платформе, AI и тренажёры, Практика на проекте, Рекомендуемый курс.
2. Настройка окружения. Настройка окружения, Настройки VSCode, Создание первой страницы.
3. Знакомство с HTML. Структура HTML, Параграфы и переносы, Заголовки, Инспектор Chrome, Структура документа, Списки, Упражнение - Вёрстка статьи, Ссылки, Изображения, Комментарии, Упражнение - Вёрстка статьи 2, Домашнее задание AI, Работа с gitflow, Тест - Знак…
4. Семантика и HTML5. Что такое HTML5?, Блочные и строчные элементы, Sup и sub, Сущности HTML, Семантическая разметка, Упражнение - Разметка сайта, Screen Readers, Тест - Семантика и HTML5, Тренажёр - Семантика и HTML5, Занятие - Семантика и HTML5, Домашнее зада…
5. Таблицы. Создание таблиц, Доступность таблиц, Colspan, rowspan, Упражнение - Вёрстка таблицы, Тест - Таблицы, Тренажёр - Таблицы, Занятие - Таблицы.
6. Формы. Form, Input, Label, Кнопки, Name, Упражнение - Поиск YouTube, Radio, Checkbox, Select, Range, Textarea, Валидация форм, Упражнение - Форма контактов, Тренажёр - Формы, Занятие - Формы, Домашнее задание - Формы.
7. Основы CSS. Для чего нужен CSS, Способы стилизации, Цвет и фон, Работа с цветами, Упражнение - Цвета формы, Стилизация текста, Font family, Тест - Основы CSS, Тренажёр - Основы CSS, Занятие - Основы CSS, Домашнее задание - Основы CSS.
8. Работа с Figma. Разбор интерфейса, Компоненты и свойства, Экспорт графики, Измерение расстояний.
9. CSS Selectors. Выбор элементов, ID элемента, Выбор по классу, Выбор по атрибуту, Упражнение - Стиль страницы, Дочерние элементы, Соседние элементы, Тест - CSS Selectors, Тренажёр - CSS Selectors, Занятие - CSS Selectors, Домашнее задание - CSS Selectors.
10. Псевдоклассы и элементы. Псевдоклассы, Псевдоклассы с параметрами, Псевдоэлементы, Стили списков, Упражнение - Дизайн списка, Тест - Псевдоклассы и элементы, Тренажёр - Псевдоклассы и элементы, Занятие - Псевдоклассы и элементы.
11. Каскад. Каскад CSS, Специфичность стилей, Important, Наследование в CSS, Тест - Каскад, Занятие - Каскад.
12. Блочная модель. О блочной модели, Ширина и высота, Границы, Padding, Margin, Упражнение - Добавление отступов, Тест - Блочная модель, Тренажёр - Блочная модель, Занятие - Блочная модель, Домашнее задание - Блочная модель.
13. Поток документа. Поток документа, Float, Display, Position, Text-align, Упражнение - Label формы, Тест - Поток документа, Тренажёр - Поток документа, Занятие - Поток документа.
14. Единицы измерения. Проценты, Em, Rem, Vh и vw, Тест - Единицы измерения, Занятие - Единицы измерения, Отзыв о курсе.
15. Анимация. Transition, Transition timing functions, Анализ анимации, Transform, Animation, Тест - Анимация, Тренажёр - Анимация, Занятие - Анимация.

Чему вы научитесь

• Научитесь уверенно работать с темой: работа с figma. разбор интерфейса, компоненты и свойства, экспорт графики, измерение расстояний.
• Освоите и сможете применять: поиск youtube, radio, checkbox, select, range, textarea, валидация форм, упражнение.
• Освоите основы: введение. html и css, как устроен курс, обзор проектов, обзор курсов, работа на платформе, ai и тренажёры, практика на проекте, рекомендуемый курс.
• Освоите и сможете применять: вёрстка статьи, ссылки, изображения, комментарии, упражнение.
• Освоите и сможете применять: цвета формы, стилизация текста, font family, тест.