#20. Уроки по CSS для НАЧИНАЮЩИХ (grid 1/2)

Описание

Поддержать автора:
https://www.donationalerts.com/r/kakeitoyroki

Учимся строить сетку (grid):
1) grid-templeate-columns, grid-template-rows === столбцы/строки
2) grid-row-gap, grid-column-gap === отступы
3) grid-auto-columns, grid-auto-rows === стандартные размеры
4) align-items, justify-items === перемещение элементов
5) align-self, justify-self === перемещение элемента
6) repeat(), minmax()
7) Единица измерения fr

Исходный код: https://github.com/R1ON/html/tree/main/css/20

Игра про grid: https://cssgridgarden.com/#ru

Видео на YouTube: https://youtu.be/c-9Y1A0ALDQ

***** Таймкоды:
00:00 Введение
01:55 grid-template-columns
03:55 grid-template-rows
04:09 repeat()
04:57 grid-auto-rows, grid-auto-columns
06:08 Единица измерения fr
11:44 Поддержка grid
12:08 minmax()
13:57 grid-row-gap, grid-column-gap
14:25 justify-items, align-items
15:30 justify-self, align-self
16:59 Значение auto
19:10 Сокращения в grid
21:04 Всем спасибо, всем пока

***** Музыка:
Glacier - Patrick Patrikios

*****
#уроки #html #html5 #для_новичков #для_начинающих #курсы #курсы_по_html # уроки_по_html #создать_сайт #frontend #front #it #программирование #верстка #css #css3 #курсы_по_css #уроки_по_css #css_grid #display #grid #grid-template-columns #grid-template-rows #grid-row-gap #grid-column-gap #gap #grid-auto-columns #grid-auto-rows #align-items #justify-items #align-self #justify-self #fr #repeat #minmax