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

Подключать CSS к HTML и самостоятельно писать правила оформления.
Выбирать элементы с помощью селекторов и понимать каскад, наследование и специфичность.
Рассчитывать размеры элементов с учётом отступов, границ и box-sizing.
Оформлять текст, изображения, фоны, границы и тени.
Управлять потоком документа, позиционированием и наложением элементов.
Создавать меню, панели и карточки с помощью Flexbox.
Строить галереи, каталоги и макеты страниц с помощью CSS Grid.
Оформлять формы и состояния элементов при наведении, фокусе и взаимодействии.
Использовать CSS-переменные, функции, переходы и анимации.
Адаптировать страницы к разной ширине экрана.
Находить ошибки и конфликтующие стили с помощью инструментов разработчика.
Организовывать CSS и собирать из отдельных компонентов целостную страницу.

О курсе

Почему отступ работает не так, как ожидалось? Откуда появляется горизонтальная прокрутка? Почему одно правило переопределяет другое, а карточки никак не выстраиваются в ряд?

Этот курс поможет разобраться в устройстве CSS и научиться осознанно управлять оформлением веб-страниц.

Мы начинаем с основ: связи HTML и CSS, подключения стилей и синтаксиса правил. Затем последовательно изучаем селекторы, каскад, размеры, отступы, типографику, визуальное оформление и позиционирование. Эти знания становятся основой для работы с Flexbox, Grid и адаптивными макетами.

Полная программа также предусматривает стилизацию форм, состояния интерфейса, CSS-переменные, функции, переходы, анимации и организацию кода.

Каждая тема закрепляется практикой. Вы будете отвечать на вопросы, прогнозировать поведение браузера, исправлять ошибки и писать собственные стили. В заданиях HTML/CSS предусмотрены стартовая разметка, конкретные требования и автоматическая проверка.

Практические работы постепенно усложняются: от оформления отдельного элемента до карточек, навигации, галерей и макетов страниц. Итоговая цель полной программы — самостоятельно собрать адаптивную страницу и объяснить, как работают её стили.

Особое внимание уделяется распространённым ошибкам. Вы научитесь искать причину неправильного размера, переполнения или неожиданного расположения элемента, а затем проверять своё исправление.

Курс создаётся поэтапно и дополняется новыми модулями. Перед началом обучения ознакомьтесь с текущим содержанием.

Для кого этот курс

Для начинающих, которые хотят изучить CSS с нуля и самостоятельно оформлять веб-страницы. Для тех, кто уже знаком с HTML, но пока затрудняется работать с размерами, отступами, расположением элементов и адаптивностью. Для студентов и начинающих веб-разработчиков, которым нужна последовательная программа с объяснениями, тестами и практикой. Для тех, кто пробовал копировать готовые стили и теперь хочет понимать, как они устроены и как изменять их под свою задачу.

Начальные требования

Предварительные знания CSS и JavaScript не требуются. Необходимый минимум HTML объясняется на примерах; знакомство с основными тегами будет преимуществом.

Для обучения понадобятся компьютер, подключение к интернету и современный браузер. Задания HTML/CSS выполняются в веб-версии Stepik.

Для самостоятельных экспериментов с файлами потребуется редактор кода, например Visual Studio Code.

Будьте готовы самостоятельно писать CSS, проверять результат и возвращаться к заданиям после ошибок: это основная часть обучения.

Как проходит обучение

Обучение строится по схеме: объяснение → пример → тест → самостоятельная практика.

В теоретических шагах вы знакомитесь с новым свойством или механизмом CSS и разбираете примеры его применения. Затем отвечаете на вопросы: выбираете подходящее решение, рассчитываете размеры или определяете причину ошибки. К вариантам ответов предусмотрены объяснения.

В практических заданиях вы работаете с готовой HTML-разметкой и пишете CSS. Можно посмотреть результат, отправить решение на автоматическую проверку и исправить невыполненные требования. В заданиях предусмотрены подсказки.

Постепенно отдельные приёмы объединяются в компоненты и страницы. Дополнительные эксперименты с шириной окна, длинным текстом и количеством элементов помогают проверить, насколько устойчиво работает решение.

Проходите материал в удобном темпе. Для регулярной практики рекомендуем выделять 4–6 часов в неделю.

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

Наши преподаватели

Что вы получаете

Последовательную программу изучения CSS от основ до адаптивной вёрстки.
Подробные объяснения с примерами кода.
Тесты с обратной связью по вариантам ответов.
Практические задания HTML/CSS с автоматической проверкой.
Опыт поиска и исправления распространённых ошибок вёрстки.
Учебные компоненты и страницы, которые можно дорабатывать самостоятельно.
Основу для собственных веб-проектов и дальнейшего изучения frontend-разработки.

Сколько стоит обучение

Расскажите о курсе друзьям

Прямая ссылка на курс:
https://stepik.org/298606

CSS с нуля: от первых стилей до адаптивной вёрстки