×
Вы действительно хотите открыть доступ к тестированию по курсу Верстка на Grid на 40 дней?
ВИДЕОУРОК №4. Subgrid, Grid vs. Flexbox, auto-fill/auto-fit
Цель урока – познакомиться с описанием курса, узнать, что такое Grid в CSS, поработать с онлайн IDE Codeopen, настроить рабочее окружение и рассмотреть примеры работы с Grid container.
Цель урока – ознакомиться с Grid Generator, рассмотреть свойство grid-template-columns, узнать новую единицу измерения fr (fraction - судьба), на практике усвоить сочетание и смешивание различных единиц измерения, таких как гибкие и фиксированные, а также научиться задавать треки с помощью repeat.
Цель урока – понять разницу между явным и неявным Grid, узнать о Grid-клеточках, Grid-области, Gap (промежутках), изучить свойства minmax, grid-auto-rows, grid-column-start, grid-column-end, grid- row-start, grid-row-end, grid-column.
Цель урока – узнать подгриды, научиться управлять порядком отображения с помощью z-index, понять разницу между двумерным (Grid) и одномерным позиционированием (Flex), изучить свойства auto-fill и auto-fit для автозаполнения треков, узнать все о display сontents.
Ціль уроку – зрозуміти як правильно позиціонувати елементи в сітці Grid за допомогою направляючих ліній, на практиці засвоїти grid-template-columns та grid-template-rows, grid-column та grid-row, grid-area та використання span в Grid.
Ціль уроку – вивчити шаблони в Grid, навчитись позиціонувати елементи в сітці за допомогою імен (alias), перевизначати контент за допомогою медіавиразів чи додаткових класів, на практиці засвоїти такі властивості як: grid-template-areas, grid-template / grid.
Цель урока – узнать, как правильно определять названия линий в Grid, а также как работать с неявными областями сетки из именуемых линий. На практике усвоить repeat при определении линий Grid.
Цель урока – изучить, как работает автоматическое размещение элементов, какой дефолтный размер строк, когда недостаточно места для контента, узнать о заполнении пробелов и анонимных элементах сетки Grid.
Цель урока – изучить техники выравнивания блоков в CSS-разметке Grid, в частности осей Grid Layout, режимов записи в сеточных макетах, физических и логических значений в выравнивании макета сетки, выравнивание элементов на блоке или столбце по оси, выравнивание элементов на встройке, центрирование элемента в области Grid, выравнивание дорожек сетки на оси блока или столбца, выравнивание и auto margins.
Цель урока – создание собственного проекта на основе полученных знаний по курсу и деплой проекта на github pages и хостинг Netlify.