简介:本课程带领大家学习新一代的网页布局方案,弥补了之前网页布局的很多不足。CSS网格布局(又名“网格”)是一个二维的基于网格的布局系统,其目的只在于完全改变我们设计基于网格的用户界面的方式。
第1章 Grid布局介绍
本章节主要介绍Grid布局的发展趋势与前景、优势、以及兼容性。
第2章 一些概念
本章节,主要介绍了网格布局中的一些常见概念,便于大家学习更加专业的内容,以及很好的掌握布局内容。
第3章 容器中的属性
本章节主要带领大家学习Grid布局中的一些常用属性,并结合案例为大家展示Grid布局的精妙之处。
- 视频: 3-1 display (11:06)
- 视频: 3-2 grid-template 定义行与列的轨道大小 (19:41)
- 视频: 3-3 grid-template 定义网格线名字 (06:05)
- 视频: 3-4 grid-template-areas (10:46)
- 视频: 3-5 grid-template 简写 (10:45)
- 视频: 3-6 gap 行与列的间距 (06:15)
- 视频: 3-7 gap 简写 (02:59)
- 视频: 3-8 items (10:22)
- 视频: 3-9 content (08:33)
- 视频: 3-10 grid-auto (07:58)
- 视频: 3-11 grid简写形式 (04:17)
第4章 CSS函数
本章节,主要带领大家学习Grid布局中的的三个函数,并结合例子进行剖析。
第5章 网格项上的属性
本章节,主要带领大家学习网格项上的属性,并结合实例进行分析。