主页 · 5

基础的HTML和CSS已经学完，接下进入JavaScript的知识学习，大致可以分为JavaScript的核心语法、DOM、BOM、ES6语法这4大模块，其中核心语法和ES6是重点，至于DOM、BOM这两个，目前有像Vue和React的框架，可以不用深入过度学习，除非想做类似框架，除此之外还有移动端的事件，TypeScript这两个，TypeScript是重点，尤其是在使用Vue3、NestJS大量使用，

一样的，在学习之前，搞懂一些匪夷所思的概念：

响应式布局是2010年5月由Ethan Marcotte提出的一个概念，本质就是一个网站兼容多端，对不同尺寸的屏幕做出响应，并进行相应布局;既然是概念，那解决的方案是什么，答案就是媒体查询

在学习本章之前，应该先建立一个概念，rem属于旧的布局方案，vw属于新的布局解决方案，rem和vw属于旧往新迁移的方案，当然这不是说rem完全淘汰，因为使用rem的存量项目基数庞大，rem布局依然非常有效，但是如果新项目，完全可以使用vw来布局

关于flex布局，网上有很多教程，但是这里记录一下我自己学习中容易踩坑的点：flex布局里面的主轴和交叉轴，不能简单的理解为横竖轴，如果映入这个想法，很容易弄混，增加学习的难度，主轴就是默认的排列方向，默认是横向，当然可以改为竖向，这时候主轴就是竖的，初学很容易就卡这一步了，什么乱七八糟横竖主轴交叉轴，所以只要记住主轴交叉轴就可以；

在学习CSS的布局之前，需要知道的一点是，不是一种布局，一个测量单位从头用尾，而是视情况使用，结合使用才是最终方案，每个布局和测量单位都有不同应用场景，而非谁淘汰谁，当然这其中会存在一些新方案和旧方案，比如rem和vw布局，在以前的项目中，可能会用到rem，但是现在新项目推荐使用vw，因为rem需要使用js动态计算，而vw是相对于视口计算，少了js，页面性能就更好，所以rem布局可以了解认识使用，但是新项目采用vw方案，理清思路之后，学习第一个布局流式布局，流体布局并不是一个完全独立新知识，所以这里会用一个demo演示，再后续的布局中，也会基于这个修改

学习CSS3中开发中的常用单位

学习移动Web开发中的视口viewpor

学习CSS3中的transition属性过渡与动画

学习CSS3中的transform属性2D3D转换