CSS

1. 文档解析完成后，将DOM和CSSDOM进行关联和映射，最后将视图渲染到浏览器窗口

注意，在上述过程中，脚本文件的下载和执行是和文档解析同步的，即它会阻塞文档的解析，若控制的不好，会影响用户体验，造成页面卡顿。

因此我们可以在script中声明defer和async这两个属性。

defer：用于开启新的线程下载脚本文件，并使脚本在文档解析完成后执行。 async：HTML5新增属性，用于异步下载脚本文件，下载完毕立即解释执行代码。

共同点

都是异步加载外部脚本文件不会阻塞页面的解析

区别

async表示异步加载，表后续文档的加载和渲染与JS脚本加载和执行并行进行,脚本文件一旦加载完成，会立即执行，我们无法预测每个脚本的下载和执行时间顺序，谁先下载好谁执行。

defer表示延迟加载，加载后续文档和JS脚本加载（仅加载不执行)并行进行，JS脚本的执行需要等待文档所有元素解析完之后，load和DOMContentLoaded事件之前执行，有顺序而言。

CSS

基础

为什么要初始化CSS样式

1. 消除浏览器之间的差异，提高兼容性
2. 提高代码质量

第一点：

未初始化时，当我们添加进去一个DIV，会发现他并不是紧贴着窗口的，而是有一定的距离的。这就是一个例子，在不同的浏览器中，对一些标签是具有的默认值的，而且不同的浏览器默认值也肯是不一样的。如果没有对其 CSS

样式做初始化，就可能导致在不同的浏览器之间展示的效果是不一样的。

第二点：

初始化后，便于我们对代码的统一管理，减少重复样式等。同时修改的时候便于统一管理。

HTML页面中 id 和 class 有什么区别

1. 在css样式表中书写时，id选择符前缀应加"#“，class选择符前缀应加”."
2. id属性在一个页面中书写时只能使用一次，而class可以反复使用
3. id作为元素标签用于区分不同结构和内容，而class作为一个样式，可以应用到任何结构和内容当中去
4. 布局上的一般原则：id先确定结构和内容再为它定义样式。而class正好相反，是先定义样式，然后在页面中

根据不同需求把样式应用到不同结构和内容上

1. 目前浏览器都允许同一个页面出现多个相同属性值的id，一般情况能正常显示，不过当javascript通过id来控