CSS Grid - самая понятная инструкция с примерами по гридам (сеткам) в CSS

↓↓↓ Тайм-коды ↓↓↓ В этом уроке мы подробно изучим работу с сеткой CSS Grid. Все на простых и понятных примерах. Тайм коды в описании. :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Бесплатный курс “Создай свой первый сайт на HTML5 и CSS3“ От установки редактора, до публикации в сети. 👉 Получить уроки, конспекты, макет и код из уроков: :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💻 Курс по созданию и верстке сайтов: Обучение с наставником, 3 месяца, результат, гарантия. Научим создавать веб-сайты и зарабатывать на этом. Старт обучения: 09 Сентября 2024 года. 💻 Курс “Frontend разработчик. JavaScript React“: Обучение с наставником, 3 месяца, результат, гарантия. Старт обучения: 16 Сентября 2024 года. 💻 Курс “Разработка сайтов на PHP MySQL“: Создание сайтов с системой управления. Присоединиться к курсу можно прямо сейчас. 🏁 Обучение с нуля 💁‍♂️ Обучение с наставником 🎯 Доведение с нуля до результата 🏢 Помощь с трудоустройством 💵 Поможем взять первый заказ на фрилансе 💳 возможна рассрочка 💳 если курс не понравится, вернём деньги в первую неделю :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 💈 Сайт школы ВебКадеми: 💈 Вступайте в группу Вконтакте: 💈 Подписывайтесь на Telegram: :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: Тайм-коды :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: 00:00 - Приветствие 00:30 - Основы сетки. Колонки, ряды, отступы 04:03 - Фракции 05:46 - Функция repeat() 08:03 - Функция minmax() 11:15 - Направление контента. grid-auto-flow 12:04 - Явная и неявная сетки. Размеры по умолчанию для рядов и колонок 15:20 - Автоматические колонки auto-fill и auto-fit 20:07 - Перемещение ячеек внутри сетки 28:36 - Выравнивание ячеек внутри колоно и рядов 33:32 - Сокращенная запись grid-template 35:00 - Области сетки grid areas 41:10 - Вложенные сетки 42:25 - Пример CSS grid в верстке сайта 48:45 - Завершение