Верстка макета на CSS Grid.
![Play](/Content/img/live-online/play.png)
Вы узнаете о современной технологии верстки CSS Grid Layout (сокращенно Grid). Познакомимся с историей Grid, узнаем почему появилась эта технология в CSS. Разберем преимущества и недостатки данной технологии. А самое главное, на практике сверстатаем макет с помощью Grid. В конце вебинара нас ждут советы, подборка полезных ресурсов по Grid и ответы на вопросы от спикера.
План вебинара:
- Знакомство.
- История создания CSS Grid Layout.
- Основы работы с технологией Grid.
- Терминология.
- Grid container (грид-контейнер).
- Grid line (грид-линия).
- Именованные грид-линии.
- Grid item (грид-элемент).
- Многослойность в Grid.
- Grid area (грид-область).
- Grid gutter (грид-интервал).
- Размеры в Grid.
- Повторы в Grid.
- Преимущества использования Grid.
- Недостатки.
- Использование Grid на практике. Делаем проект по PSD макету.
- Подборка полезных ресурсов и статей по CSS Grid.
- Ответы на вопросы.
Целевая аудитория:
Начинающие верстальщики и FrontEnd разработчики.
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)
![date](/Content/img/webinars/web-date.png)
![time](/Content/img/webinars/web-time.png)
![view](/Content/img/webinars/web-views.png)