CSS Grid Layout #1. Введение и создание базовой сетки
Спонсоры канала имеют доступ к готовому коду и многим другим бонусам! Подробнее:
https://www.youtube.com/channel/UChb6d9b2c3U4-ZnUkT4h5BQ/join
В этом уроке мы поймем что такое CSS Grid Layout и зачем он нужен. Ознакомимся с основными возможностями и научимся работать с колонками и строками в css grid сетке. Разберем подробно функцию repeat и наглядно познакомимся с новой единицей измерения FR. CSS грид это новый взгляд решения типичных проблем при верстке.
Оглавление:
0:00 что такое css grid layout
1:09 что можно делать с помощью css grid
1:42 как работать с колонками в grid
3:42 новая css единица измерения fr
4:35 как работает функция repeat
5:43 как работать с grid строками
Паблик ВК - https://vk.com/steptooweb
Паблик телеграм - https://t.me/step_to_web
Если вам нравятся мои видео, обязательно подписывайтесь на канал и ставьте пальцы вверх!
Поддержать проект финансово:
ЯД - 410019809390277
Bitcoin - 1GgYeUxciUhsnorN1rYWXBuBa6L9fjzXCK
Видео CSS Grid Layout #1. Введение и создание базовой сетки канала Step to Web
https://www.youtube.com/channel/UChb6d9b2c3U4-ZnUkT4h5BQ/join
В этом уроке мы поймем что такое CSS Grid Layout и зачем он нужен. Ознакомимся с основными возможностями и научимся работать с колонками и строками в css grid сетке. Разберем подробно функцию repeat и наглядно познакомимся с новой единицей измерения FR. CSS грид это новый взгляд решения типичных проблем при верстке.
Оглавление:
0:00 что такое css grid layout
1:09 что можно делать с помощью css grid
1:42 как работать с колонками в grid
3:42 новая css единица измерения fr
4:35 как работает функция repeat
5:43 как работать с grid строками
Паблик ВК - https://vk.com/steptooweb
Паблик телеграм - https://t.me/step_to_web
Если вам нравятся мои видео, обязательно подписывайтесь на канал и ставьте пальцы вверх!
Поддержать проект финансово:
ЯД - 410019809390277
Bitcoin - 1GgYeUxciUhsnorN1rYWXBuBa6L9fjzXCK
Видео CSS Grid Layout #1. Введение и создание базовой сетки канала Step to Web
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
![CSS Grid Layout #2 - min-content, max-content, minmax()](https://i.ytimg.com/vi/SLxLc8uHup4/default.jpg)
![CSS Grid. Полный курс](https://i.ytimg.com/vi/yTLqfUxwdDk/default.jpg)
![](https://i.ytimg.com/vi/E5bJyML0A5I/default.jpg)
![CSS Grid Layout With Image Span](https://i.ytimg.com/vi/-qOe8lBAChE/default.jpg)
![CSS Grid - верстка будущего](https://i.ytimg.com/vi/qJ5jzRaGgVY/default.jpg)
![The Magic of CSS Grid AUTO-FIT vs AUTO-FILL](https://i.ytimg.com/vi/qII5BueXWD4/default.jpg)
![Creating Layout Using CSS Grid and Flexbox](https://i.ytimg.com/vi/XnVyBGWo8Ug/default.jpg)
![10 методов массивов в Javascript которые вы должны знать!](https://i.ytimg.com/vi/xEFeiKULMKs/default.jpg)
![CSS Grid Layout #10 - авто-размещение элементов с grid-auto-flow](https://i.ytimg.com/vi/doirdfVM_MI/default.jpg)
![Позиционирование ячеек в CSS Grid](https://i.ytimg.com/vi/IWA24sI9O3s/default.jpg)
![Рисование иконок на чистом CSS #2](https://i.ytimg.com/vi/Sb1SbOZTreM/default.jpg)
![CSS Grid Layout. Свойства определения сетки grid-template и другие](https://i.ytimg.com/vi/FPL4hnmA84A/default.jpg)
![Адаптивная верстка на CSS Grid для интернет магазина. Использование grid areas](https://i.ytimg.com/vi/CUkqUxd-I9I/default.jpg)
![How to Create Website Layouts Using CSS Grid | Learn HTML and CSS | HTML Tutorial](https://i.ytimg.com/vi/HgwCeNVPlo0/default.jpg)
![CSS Grid | Real world examples](https://i.ytimg.com/vi/YnYdwezNjNg/default.jpg)
![Become a CSS Shadow Master! Layered CSS Shadows Tutorial](https://i.ytimg.com/vi/DG6C-GMeLiI/default.jpg)
![Уроки Bootstrap 5 - Система сетки](https://i.ytimg.com/vi/uNkRwp84JpA/default.jpg)
![Grid CSS полный курс за 13 минут. Все свойства](https://i.ytimg.com/vi/MEOR2b69Pl4/default.jpg)
![Калькулятор на чистом JavaScript и Grid CSS с нуля | Верстка, скрипт и его безопасность](https://i.ytimg.com/vi/ew1oapoX2Ho/default.jpg)
![Фильтр контента по категориям на чистом Javascript](https://i.ytimg.com/vi/iu_MjqI5zXI/default.jpg)