Содержание курса
1. Настройка рабочего окружения
2 урока
95
88
8м
0
Открытый
1.1
Как устроен курс
↗
61
61
1м 3с
0
Открытый
1.2
Настройка рабочего окружения
↗
34
27
7м 22с
0
2. Старт и подключение CSS
4 урока
114
89
21м
0
Открытый
2.1
Что такое CSS и как он работает в браузере
↗
32
27
6м 47с
0
Открытый
2.2
Способы подключения: inline, style, link
↗
31
25
7м 38с
0
Открытый
2.3
Структура CSS правил: селектор, свойства, значения
↗
28
22
7м 20с
0
Открытый
2.4
Введение в CSS
↗
23
15
1м 0с
0
3. Селекторы и базовые свойства
3 урока
58
50
22м
0
Открытый
3.1
Простые селекторы: тег, класс, id
↗
22
22
6м 55с
0
Открытый
3.2
Комбинации и вложенность: потомок, ребенок, соседи
↗
20
16
11м 20с
0
Открытый
3.3
Группировка селекторов
↗
16
12
4м 23с
0
4. Каскад, наследование и специфичность
3 урока
42
34
34м
0
Открытый
4.1
Каскад и порядок применения стилей
↗
16
13
11м 45с
0
Открытый
4.2
Специфичность и конфликты стилей
↗
14
14
6м 24с
0
Открытый
4.3
Практика: разбор типичных ошибок и их исправление
↗
12
7
17м 46с
0
5. Цвета, фоны и изображения
4 урока
45
34
29м
0
Открытый
5.1
Форматы цветов: hex, rgb, rgba, hsl
↗
14
8
16м 27с
0
Открытый
5.2
Фон и цвет
↗
12
9
8м 30с
0
Открытый
5.3
Градиенты
↗
9
9
-
0
Открытый
5.4
Практика: Фон и Цвет
↗
10
8
5м 32с
0
6. Единицы измерения и размеры
2 урока
29
16
13м
0
Открытый
6.1
Единицы измерения в CSS
↗
15
8
11м 48с
0
Открытый
6.2
Задачник для практики по CSS
↗
14
8
2м 52с
0
7. Типографика и читаемость
3 урока
34
25
23м
0
Открытый
7.1
Стилизация шрифта
↗
14
8
16м 49с
0
Открытый
7.2
Подключение шрифтов
↗
10
8
4м 52с
0
Открытый
7.3
Практика: Стилизация шрифта
↗
10
9
3м 59с
0
8. Бордеры и скругления
4 урока
35
24
16м
0
Открытый
8.1
border-width, border-style, border-color
↗
11
7
11м 42с
0
Открытый
8.2
Отдельные стороны: border-top и т.д.
↗
9
9
-
0
Открытый
8.3
border-radius: круги, капсулы, сложные скругления
↗
8
4
2м 18с
0
Открытый
8.4
Практика: карточки, кнопки, блоки
↗
7
4
3м 6с
0
9. Блочная модель и геометрия элементов
4 урока
27
17
26м
0
Открытый
9.1
Ширина и высота элементов
↗
8
5
4м 43с
0
Открытый
9.2
Отступы
↗
7
4
6м 41с
0
Открытый
9.3
box-sizing: content-box и border-box
↗
6
4
12м 56с
0
Открытый
9.4
Практика: карточки и отступы
↗
6
4
5м 58с
0
10. Позиционирование и слои
3 урока
18
15
23м
0
Открытый
10.1
Позиционирование элементов
↗
6
5
7м 10с
0
Открытый
10.2
Контекст наложения
↗
6
5
9м 4с
0
Открытый
10.3
Практика: позиционирование элементов
↗
6
5
6м 26с
0
11. Flexbox: выравнивание и компоновка
5 уроков
23
18
20м
0
Открытый
11.1
flex-container и flex-items
↗
7
4
2м 14с
0
Открытый
11.2
justify-content, align-items, gap
↗
5
4
4м 22с
0
Открытый
11.3
flex-direction, wrap
↗
4
4
1м 28с
0
Открытый
11.4
flex-grow, flex-shrink, flex-basis
↗
4
3
2м 21с
0
Открытый
11.5
Итоги и закрепление темы Flexbox
↗
3
3
9м 26с
0
12. Grid: сетки для макетов
5 уроков
18
16
17м
0
Открытый
12.1
Grid контейнер
↗
5
4
1м 29с
0
Открытый
12.2
grid-template-columns rows
↗
4
3
6м 59с
0
Открытый
12.3
gap, repeat, fr
↗
3
3
-
0
Открытый
12.4
Размещение элементов: grid-column, grid-row, areas
↗
3
3
2м 25с
0
Открытый
12.5
Практика: сетка секций и адаптивная раскладка
↗
3
3
7м 51с
0
13. Псевдоклассы и псевдоэлементы
4 урока
18
16
20м
0
Открытый
13.1
Псевдоклассы
↗
5
5
4м 27с
0
Открытый
13.2
nth-child и базовые сценарии
↗
4
4
-
0
Открытый
13.3
Псевдоэлементы
↗
4
4
3м 13с
0
Открытый
13.4
Практика: кнопки, ссылки, декоративные элементы
↗
5
3
12м 29с
0
14. Анимации и плавность интерфейса
3 урока
13
11
17м
0
Открытый
14.1
transition: что можно анимировать
↗
6
4
7м 45с
0
Открытый
14.2
transform: translate, scale, rotate
↗
4
4
4м 24с
0
Открытый
14.3
Практика: микроанимации без перегруза
↗
3
3
6м 48с
0
15. Тени и глубина интерфейса
3 урока
9
9
3м
0
Открытый
15.1
box-shadow: параметры, мягкие и жесткие тени
↗
3
3
-
0
Открытый
15.2
text-shadow
↗
3
3
1м 11с
0
Открытый
15.3
Практика: карточки, ховер эффекты, акценты
↗
3
3
2м 5с
0
16. CSS-методологии
2 урока
7
7
8м
0
Открытый
16.1
Что такое CSS-методологии и зачем они нужны
↗
3
3
1м 15с
0
Открытый
16.2
Методология BEM: блок, элемент, модификатор
↗
4
4
6м 16с
0
17. Стилизация UI компонентов
1 урок
3
3
11м
0
Открытый
17.1
Инфо: наборы компонентов
↗
3
3
11м 50с
0
18. Адаптивность и медиазапросы
4 урока
12
12
21м
0
Открытый
18.1
Подходы: mobile first и desktop first
↗
3
3
2м 53с
0
Открытый
18.2
Breakpoints и медиазапросы
↗
3
3
5м 27с
0
Открытый
18.3
Адаптивные размеры: %, vw, rem
↗
3
3
7м 44с
0
Открытый
18.4
Практика: медиазапросы
↗
3
3
7м 3с
0
19. Мини проект: финальная сборка портфолио
10 уроков
36
32
25м
0
Открытый
19.1
Подготовка проекта
↗
6
4
3м 49с
0
Открытый
19.2
База CSS
↗
6
4
4м 42с
0
Открытый
19.3
Header + навигация
↗
1
1
11м 11с
0
Открытый
19.4
Hero (приветствие)
↗
1
1
8м 43с
0
Открытый
19.5
Project card: оформление карточек
↗
1
1
-
0
Открытый
19.6
About + Experience
↗
3
3
-
0
Открытый
19.7
Skills + Contacts
↗
4
4
-
0
Открытый
19.8
Форма + Footer
↗
5
5
-
0
Открытый
19.9
Адаптивность
↗
4
4
-
0
Открытый
19.10
Публикация
↗
5
5
-
0
20. Итоги
2 урока
11
8
0м
0
Открытый
20.1
Тест
↗
6
3
-
0
Открытый
20.2
Материалы
↗
5
5
-
0