CSS文件是如何被浏览器解析并应用到网页上的

文章	分类	评论
323	4	39

文章

分类

323

下载CSS文件：当浏览器遇到一个标签或@import指令引用的CSS文件的时候首先下载这个文件。

解析CSS：下载完成之后，浏览器会解析CSS文件的内容，讲CSS代码转换成浏览器可以理解和使用的结构。这个结构被叫做CSS对象模型（CSSOM）

构建渲染树：当DOM和CSSOM都构建完毕之后浏览器讲这两个结合起来形成渲染树。渲染数只包含实际要渲染的节点，并且每个节点都有相对应的CSS样式信息。

布局layout：一旦渲染树构建完成，浏览器会进行布局，在这个过程中，浏览器会就算每个节点的确切位置和大小，布局的结果依赖于渲染树中的节点以及他们的样式。
绘制Paint：布局完成后，下一步是绘制，即浏览器将渲染数中的每一个节点转换为屏幕上的实际像素，这包括文本，颜色，图像，边框等视觉效果
合成Composite：某些元素可能需要在单独的层上进行绘制和合成。单独的合成层通常用于优化性能，特别是在动画和高频变化的元素上，因为他们可以在不影响其他部分的情况下独立更新。
扩展：Javascript引擎，V8引擎。