Курс на Stepik
Обложка курса «Основы вёрстки с HTML и CSS» на Stepik
990 ₽

Основы вёрстки с HTML и CSS ★ 4.167

Открыть на
STEPIK.ORG

Хотите научиться верстать сайты, используя HTML и CSS? Этот курс проведёт вас через все основы, позволяющие с лёгкостью применять HTML и CSS на практике. Вы сверстаете на практике сайт по макету, переданному вам дизайнером, получив в конце курса грамотно свёрстанный сайт. Если вы программист, этот курс позволит вам продвинуться в изучении front-end разработки, а также перейти к изучению back-end разработки, которая так или иначе зачастую касается фронта.

Показатель Текущие показатели Рост
Значение 🏆 Рейтинг 3 дн 7 дн 30 дн
Количество учеников на курсе «Основы вёрстки с HTML и CSS»Учеников на курсе 699
Сертификаты, выданные на курсе «Основы вёрстки с HTML и CSS»Сертификатов выдано 0
Отзывы о курсе «Основы вёрстки с HTML и CSS»Отзывов получено 6
Рейтинг курса «Основы вёрстки с HTML и CSS»Рейтинг курса 4.167
Уроки в курсе «Основы вёрстки с HTML и CSS»Количество уроков 66
Время прохождения курса «Основы вёрстки с HTML и CSS»Время прохождения курса —
Стоимость курса «Основы вёрстки с HTML и CSS»Стоимость курса 990 ₽ —
Обновления курса «Основы вёрстки с HTML и CSS»Обновления курса — —
Дата публикации курса «Основы вёрстки с HTML и CSS»Дата публикации курса — ———
Последнее обновление курса «Основы вёрстки с HTML и CSS»Последнее обновление — ———
Сложность easy — ———

Содержание курса

Разделы в курсе «Основы вёрстки с HTML и CSS» 8 разделов Уроки в курсе «Основы вёрстки с HTML и CSS» 66 уроков Время прохождения курса «Основы вёрстки с HTML и CSS» 11 ч. Последнее обновление курса «Основы вёрстки с HTML и CSS» обн. 1 год назад

1. GitHub, Figma, Макет

8 уроков
Закрытый
1.1 Знакомство с GitHub ↗
278
278
11м 28с
7
Закрытый
1.2 Создание и клонирование репозитория ↗
208
208
4м 3с
1
Закрытый
1.3 Изменения, commit, push ↗
185
185
9м 41с
5
Открытый
1.4 Макет и знакомство с Figma ↗
768
321
9м 52с
10
Закрытый
1.5 Картинки и их экспорт ↗
176
176
19м 43с
5
Закрытый
1.6 Расширения VSCode ↗
170
170
5м 36с
3
Закрытый
1.7 Форматы картинок, иконки. Знакомство с index.html ↗
155
155
9м 40с
4
Закрытый
1.8 Исходники первого модуля. Домашнее задание ↗
160
160
1м 56с
2

2. Теги и начало вёрстки макета

9 уроков
Закрытый
2.1 Базовые теги. Консоль devtools ↗
175
175
12м 24с
8
Закрытый
2.2 Разновидности тегов. Табличные теги. ↗
140
140
7м 7с
5
Закрытый
2.3 Заголовки и списки ↗
139
139
7м 58с
2
Закрытый
2.4 Разметка блока Header ↗
131
131
20м 47с
5
Закрытый
2.5 Разметка секций услуг. Тег section. ↗
130
130
7м 57с
3
Закрытый
2.6 Разметка секции "Отзывы" ↗
120
120
16м 37с
4
Закрытый
2.7 Разметка подвала (footer). Тег div. ↗
116
116
11м 38с
6
Закрытый
2.8 Подведение итога ↗
113
113
2м 26с
3
Закрытый
2.9 Исходники модуля и Домашнее задание ↗
119
119
0м 15с
4

3. Знакомство с CSS

5 уроков
Закрытый
3.1 Введение в стили CSS ↗
118
118
22м 4с
5
Закрытый
3.2 Практика: добавляем и применяем CSS ↗
108
108
7м 26с
3
Закрытый
3.3 Перенос с макета ссылок и цветов ↗
104
104
30м 10с
4
Закрытый
3.4 Перенос шрифтов ↗
94
94
23м 53с
6
Закрытый
3.5 Исходники и Домашнее задание ↗
100
100
0м 11с
3

4. Отступы, devtools, блочные элементы

7 уроков
Закрытый
4.1 Разбор ДЗ ↗
87
87
35м 50с
5
Закрытый
4.2 Стили и devtools. Вкладки styles & computed ↗
83
83
3м 2с
3
Закрытый
4.3 Блочные и строчные элементы ↗
80
80
4м 6с
3
Закрытый
4.4 Padding ↗
77
77
7м 42с
2
Закрытый
4.5 Margin ↗
76
76
23м 57с
2
Закрытый
4.6 Практика: перенос отступов в различных блоках с макета ↗
75
75
27м 52с
4
Закрытый
4.7 Исходники и Домашнее Задание ↗
73
73
0м 8с
1

5. Флексбоксы

9 уроков
Закрытый
5.1 Разбор ДЗ - Вёрстка блока About ↗
79
79
9м 5с
2
Закрытый
5.2 Разбор ДЗ - Блоки Clients, Advantages ↗
70
70
6м 32с
2
Закрытый
5.3 Разбор ДЗ - Блок Footer ↗
64
64
13м 57с
2
Закрытый
5.4 Флексбокс. Концепция и зачем применяется ↗
70
70
6м 13с
1
Закрытый
5.5 Флексбокс. Управление по осям ↗
69
69
10м 13с
2
Закрытый
5.6 Флексбокс. order, flex-direction, flex-wrap ↗
66
66
9м 55с
3
Закрытый
5.7 Делаем кнопку и блок About на флексах. Часть 1 ↗
66
66
12м 50с
1
Закрытый
5.8 Делаем кнопку и блок About на флексах. Часть 2 ↗
65
65
2м 18с
1
Закрытый
5.9 Исходники и Домашнее Задание ↗
66
66
0м 12с
3

6. Формы, группировки, селекторы

12 уроков
Закрытый
6.1 Разбор ДЗ Блоки services и clients ↗
65
65
7м 50с
1
Закрытый
6.2 Разбор ДЗ - Блок Преимущества ↗
60
60
11м 38с
3
Закрытый
6.3 Разбор ДЗ - Блок футера ↗
59
59
6м 26с
1
Закрытый
6.4 Формы. Поля ввода и их типы ↗
61
61
8м 27с
1
Закрытый
6.5 Формы. Checkbox, Label ↗
61
61
9м 57с
1
Закрытый
6.6 Группировка. Fieldset, legend, radiobutton ↗
60
60
6м 44с
3
Закрытый
6.7 Атрибуты value, checked, placeholder. Отправка формы ↗
60
60
9м 46с
1
Закрытый
6.8 Селекторы и их вес ↗
61
61
13м 10с
1
Закрытый
6.9 Форма с элементами ввода ↗
59
59
17м 45с
2
Закрытый
6.10 placeholder и кнопки ↗
56
56
5м 4с
1
Закрытый
6.11 Пояснение к ДЗ ↗
56
56
1м 52с
1
Закрытый
6.12 Исходники и Домашнее Задание ↗
58
58
0м 11с
1

7. Позиционирование и поведение

7 уроков
Закрытый
7.1 Разбор ДЗ: Оформляем popup ↗
56
56
17м 24с
1
Закрытый
7.2 Позиционирование, position absolute ↗
55
55
9м 51с
1
Закрытый
7.3 Псевдоэлементы. position fixed. Позиционирование popup ↗
54
54
15м 45с
2
Закрытый
7.4 Поведение элементов. Кнопки и ссылки ↗
52
52
16м 41с
1
Закрытый
7.5 Практика. Кнопки и ссылки. ↗
54
54
21м 37с
3
Закрытый
7.6 Делаем поведение в блоке service ↗
50
50
10м 8с
1
Закрытый
7.7 Исходники и Домашнее Задание ↗
50
50
0м 15с
2

8. Завершение проекта

9 уроков
Закрытый
8.1 Блок About ↗
62
62
8м 18с
2
Закрытый
8.2 Блок Clients ↗
47
47
9м 25с
1
Закрытый
8.3 Футер ↗
49
49
10м 40с
2
Закрытый
8.4 Ревью ↗
52
52
10м 25с
1
Закрытый
8.5 Popup ↗
49
49
12м 11с
3
Закрытый
8.6 Inputs ↗
53
53
9м 8с
3
Закрытый
8.7 Radio Buttons ↗
51
51
19м 10с
2
Закрытый
8.8 JS Popup ↗
59
59
13м 16с
4
Закрытый
8.9 Исходники и ссылки ↗
68
68
0м 7с
5