Адаптивность страниц
CSS
Flex
Grid
Media Queries

Позиционирование в CSS

Навык разработки адаптивных интерфейсов, позволяющий создавать удобные и функциональные решения для различных устройств
Начать обучение
выпускник Хекслета
Егор Самойлин
выпускник Хекслета

Программа обучения

1 месяц
10 часов теории
70 часов практики
Что важно знать заранее
Для успешного прохождения курса вам нужно знание HTML и CSS на базовом уровне.
Если вы пока не знакомы с программированием, не переживайте!
У нас есть вводные курсы, которые помогут вам освоить основы и подготовиться к обучению. Мы объясним всё с нуля — доступно и наглядно
Позиционирование элементов
Виды позиционирований элементов, плавающие элементы, наложение элементов
Grid и Flex
Флекс-контейнер, выравнивание элементов по осям, свойства Flex-элементов, расположение элементов в сетке
Адаптивность сайта
Проверка сайта на адаптивность, Viewport, гибкие элементы, медиазапросы
Проект
Портал «Music Box»
<span class="translation_missing" title="translation missing: ru.web.programs.track.blocks_ru.new_identity.syllabus.illustration">Illustration</span>

В рамках проекта вы разработаете две страницы музыкального портала "Music Box" — логическое продолжение предыдущего проекта. В процессе работы вы освоите методологии OOCSS и Atomic CSS, а также закрепите навыки адаптивной вёрстки и работы с препроцессором SASS.

Вы самостоятельно реализуете адаптивный дизайн, что позволит продемонстрировать профессиональный уровень. Работа с макетом в Figma поможет улучшить навыки визуального проектирования и сделает ваше портфолио более привлекательным для работодателей.

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

Просто, наглядно и всегда под рукой
Вы изучаете теорию в удобном текстовом формате — легко читать даже с телефона. Живые примеры помогают сразу понять, как всё работает на практике. Материал выстроен так, чтобы вы шаг за шагом двигались от простого к сложному, не упуская важных деталей
Проверяем и закрепляем знания
После каждой темы вы проходите квизы, которые помогают убедиться, что вы всё поняли. Вопросы разного уровня сложности дадут возможность как проверить базу, так и попрактиковаться в применении знаний
Учитесь на реальных задачах
Мы создали удобную виртуальную среду, где вы решаете задачи прямо в браузере. У вас есть редактор кода, консоль и автоматические тесты, которые моментально показывают результат
Ваш AI-наставник в учебе
Наш Учебный помощник на базе ИИ — это как наставник, который всегда под рукой. Он понимает, где вы находитесь в курсе, что нужно сделать, и как выглядит ваш код. Если что-то пошло не так, вы сразу получите понятные и полезные подсказки
Занимаетесь сами, но не в одиночестве
Тяжело сохранять мотивацию, если обучаешься самостоятельно, поэтому мы создали крепкое IT-сообщество, где каждый студент получает поддержку и находит полезные контакты среди других разработчиков
IT-сообщество
Стоимость курса
Старт в любой момент
Продолжительность 2 месяца
Свободный режим учебы
AI-помощник
Интегрированное обучение: теория, тесты, тренажеры, проекты
Членство в IT-сообществе
от 3 900 ₽/мес
Начать учиться
Хотите учиться от компании?

Расскажите вашему работодателю о Хекслете

Иллюстрация
Подробнее

Вопрос-ответ

Даже опытные разработчики найдут в наших курсах полезные знания. Мы подробно изучаем сложные структуры данных и их применение в задачах оптимизации кода.

Занятия помогут вам укрепить навыки программирования, улучшить архитектуру кода и глубже понять принципы работы алгоритмов. Курс поможет не только укрепить текущие навыки, но и подготовиться к следующему карьерному шагу

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

Мы рекомендуем выделять 5-10 часов в неделю. Так с одной стороны обучение будет достаточно интенсивным, чтобы не растягивать его надолго, а с другой — достаточно комфортным, чтобы совмещать с работой и успевать отдыхать

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

Мы принимаем карты Visa, MasterCard и МИР любого банка, валюта счёта тоже может быть любой