简介:本课程带领大家学习新一代的网页布局方案,弥补了之前网页布局的很多不足。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章 网格项上的属性
本章节,主要带领大家学习网格项上的属性,并结合实例进行分析。
解锁即可观看《前端工程师》完整课程视频
前端工程师
前端入门如同写字,如果你不知道从哪开始,那就选择前端(含Vue3.x,React17,TS)
【第1周】HTML5基础语法与标签
【第2周】CSS3基础语法与盒模型
【第3周】CSS3浮动定位与背景样式
【第4周】CSS3动画与穷游首页开发实战
【第5周】JS基础语法与表达式
【第6周】JS流程控制语句与数组
【第7周】JS函数与DOM
【第8周】面向对象
【第9周】项目实战:仿穷游JS特效开发
【第10周】ES6基础入门
【第11周】ES6语法扩展
【第12周】ES6之Promise与Class类
【第13周】ES6之Module模块与Babel编译
【第14-15周】HTTP 协议、存储、Ajax
【第16周】项目实战:仿穷游组件化开发
【第17周】移动基础
【第18周】移动进阶之高效开发
【第19周】项目实战:仿穷游移动webapp开发
【第20周】小程序基础与慕课小程序实战
【第21-22周】Sass基础与Vue.js基础语法
【第23周】项目实战:Vue.js仿京东到家电商全栈项目前端开发(上)
【第24-25周】项目实战:Vue.js仿京东到家电商全栈项目前端(下)
【第26周】全栈必备基础Node.js
【第27周】koa2中间件与MongoDB数据库
【第28-29周】项目实战:node.js仿京东到家电商全栈项目后端开发
【第30周】TypeScript与React.js基础语法
【第31-32周】React旅游网开发与工程化
【第33周】就业必备基础技术面试分析
【第34周】就业必备框架与全栈技术面试分析