курс

CSS: Вёрстка на Grid

1841 студент 259 сообщений
Последнее обновление: 29 февраля 2024
Курс CSS: Вёрстка на Grid
3 900 ₽ в месяц
за все курсы Хекслета
Зарегистрироваться
  • Тренажер с практикой
  • Бессрочный доступ к теории
  • Асинхронный формат
    обучения

Включено в курс

7 уроков (видео и/или текст)
8 упражнений в тренажере
23 проверочных теста
Помощь в «Обсуждениях»
Доступ к остальным курсам платформы

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

  • Базовым свойствам CSS Grid Layout.
  • Создавать сетки и управлять пространством внутри них.
  • Управлять расположением HTML-элементов внутри сетки.
  • Адаптировать сетки для разных разрешений экрана.

Описание

На этом курсе вы изучите позиционирование с помощью CSS Grid. Вы узнаете больше о создании сеток и управлении элементами внутри них. В итоге вы научитесь распределять пространство внутри ячеек, адаптировать сетки под разные размеры экрана и создавать свои собственные сетки. CSS Grid пригодится, если вы решите создавать сложные сеточные шаблоны, в которых необходимо одновременно управлять элементами по двум осям. Знания из этого курса помогают программистам быстро создавать сложные журнальные шаблоны. Этот курс подойдет всем веб-разработчикам, которые хотят использовать современные стандарты.

Курс CSS Grid показывает новые возможности по позиционировании элементов на странице. Если на Flex позиционировались небольшие блоки, то Grid позволяет создавать сетки и позиционировать по ним большие блоки страницы: шапка, блоки основного контента, боковые секции и так далее.

Для прохождения курса вам понадобятся базовые знания вёрстки контента. Эти знания вы можете получить в курсе Основы верстки контента

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

Продолжительность 6 часов
  • 1

    Введение

    Знакомимся с концепцией Grid, говорим о ключевых моментах и отличиях от Flex
  • 2

    Терминология

    Знакомимся с понятиями сеток и их составлящими в CSS Grid Layout

    тесты

  • 3

    Первая сетка

    Поговорим о свойствах, позволяющие создавать сетки с помощью CSS Grid Layout

    тесты

    упражнение

  • 4

    Расположение элементов в сетке

    Изучаем свойства, позволяющие произвольно располагать элементы внутри сетки

    тесты

    упражнение

  • 5

    Работа с сеткой

    Изучаем отступы между полосами и выравнивание полос сетки

    тесты

    упражнение

  • 6

    Неявная сетка

    Поговорим отличия явной и неявной сетки, изучим свойства grid-auto-rows и grid-auto-columns

    тесты

  • 7

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

    Изучаем влияние свойств позиционирования и z-index при использовании внутри сетки

    тесты

  • 8

    Дополнительные материалы

    Статьи и видео, подобранные командой Хекслета. Помогут глубже погрузиться в тему курса

Формат обучения

Испытания

Это практические задания, которые мы советуем выполнить после завершения курса. Задания помогут вам получить дополнительный опыт в программировании и закрепить полученные навыки. Обычно мы рекомендуем выполнить 3-5 испытаний. Но если не получается, не отчаивайтесь. Просто вернитесь к ним позже

#
Задание
% завершений
2
66%

Рекомендуемые программы

профессия
Верстка с использованием последних стандартов CSS
5 месяцев
с нуля
Старт в любое время
профессия
от 6 300 ₽ в месяц
Разработка фронтенд-компонентов для веб-приложений
10 месяцев
с нуля
Старт 28 марта
профессия
от 6 300 ₽ в месяц
Разработка веб-приложений на Django
10 месяцев
с нуля
Старт 28 марта
профессия
от 6 183 ₽ в месяц
Ручное тестирование веб-приложений
4 месяца
с нуля
Старт 28 марта
профессия
от 6 300 ₽ в месяц
Разработка приложений на языке Java
10 месяцев
с нуля
Старт 28 марта
профессия
от 5 025 ₽ в месяц
новый
Сбор, анализ и интерпретация данных
9 месяцев
с нуля
Старт 28 марта
профессия
от 6 300 ₽ в месяц
Разработка веб-приложений на Laravel
10 месяцев
с нуля
Старт 28 марта
профессия
от 5 840 ₽ в месяц
Создание веб-приложений со скоростью света
5 месяцев
c опытом
Старт 28 марта
профессия
от 9 900 ₽ в месяц
Разработка фронтенд- и бэкенд-компонентов для веб-приложений
16 месяцев
с нуля
Старт 28 марта
профессия
от 6 300 ₽ в месяц
Разработка бэкенд-компонентов для веб-приложений
10 месяцев
с нуля
Старт 28 марта
профессия
новый
Автоматизированное тестирование веб-приложений на JavaScript
8 месяцев
c опытом
в разработке
Старт 28 марта