CSS Grid - самая понятная инструкция с примерами по гридам (сеткам) в CSS
В этом уроке мы подробно изучим работу с сеткой CSS Grid. Все на простых и понятных примерах. Тайм коды в описании.
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Если хочешь сверстать свой первый сайт, обрати внимание на наш бесплатный курс по созданию сайта "Портфолио": https://webcademy.ru/htmlsite/
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Курс Профессия HTML верстальщик
Обучение с наставником, 3 месяца, результат, гарантия.
https://webcademy.ru/htmlstart/
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
Сайт школы ВебКадеми: https://webcademy.ru/
Вконтакте: https://vk.com/webcademy
Telegram канал: https://t.me/webcademynews
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
Тайм-коды
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
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 - Завершение
Видео CSS Grid - самая понятная инструкция с примерами по гридам (сеткам) в CSS канала ВебКадеми
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Если хочешь сверстать свой первый сайт, обрати внимание на наш бесплатный курс по созданию сайта "Портфолио": https://webcademy.ru/htmlsite/
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
💻 Курс Профессия HTML верстальщик
Обучение с наставником, 3 месяца, результат, гарантия.
https://webcademy.ru/htmlstart/
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
Сайт школы ВебКадеми: https://webcademy.ru/
Вконтакте: https://vk.com/webcademy
Telegram канал: https://t.me/webcademynews
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
Тайм-коды
::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
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 - Завершение
Видео CSS Grid - самая понятная инструкция с примерами по гридам (сеткам) в CSS канала ВебКадеми
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
CSS Grid Layout vs Flexbox - противостояние или гармонияCSS Grid. Годное Руководство.Ошибки в HTML верстке сайтов. Никогда не верстай такС чего начать изучать веб-разработку? Как стать веб-разработчиком в 2021 годуДизайн сайта в Adobe XDМОДУЛЬНЫЕ СЕТКИ В ВЕБ-ДИЗАЙНЕФриланс в веб-разработке. Как зарабатывать из дома28 мая 2021. Разбор HTML верстки подписчиков. Ответы на вопросыGrid Layout как основа современной раскладки / Сергей Попов (Лига А./HTML Academy)Все о CSS переходах (transitions) за 16 минут. CSS анимация. Часть первая.CSS Grid Layout. Свойства определения сетки grid-template и другиеFlexbox CSS3 в одном видео за 20 минут!В чем разница между Float, Flexbox и Grid CSS?Grid CSS полный курс за 13 минут. Все свойстваHTML и CSS с нуля для начинающих | 🔥 Быстрый Старт!Как работает bootstrap 4 сетка. Основы по grid. ПрактикаCSS свойствах необходимые начинающему / CSS урокиАдаптивная верстка сайтов легко. Bootstrap в прошлом!CSS Grid Layout. Кроссбраузерность. Grid и Flex. Основные понятия.CSS Grid - верстка будущего