css渲染机制、优先级以及效率准则的那些事

前端人员几乎每天都要跟页面打交道，所以正常情况下你迟早还是要了解那些HTML和CSS等的一些渲染机制。一来是为了装逼你的专业技能，二来的确是可以提升各种效率，最终的结果就是你可以收获更多的银子。最终决定浏览器表现出来的页面效果的差异是由浏览器渲染引擎 Rendering Engine（也叫做排版引擎），也就是我们通常所说的“浏览器内核”，负责解析网页语法（如HTML、CSS、JavaScript）并渲染、展示的结果。相同的代码在不同的浏览器呈现出来的效果不一样，那么就很有可能是不同的浏览器内核导致的。加载页面时浏览器的具体工作流程是：1、解析HTML以重建DOM树（Parsing HTML to construct the DOM tree ）：渲染引擎开始解析HTML文档，转换树中的标签到DOM节点，它被称为“内容树”。2、构建渲染树（Render tree construction）：解析CSS（包括外部CSS文件和样式元素），根据CSS选择器计算出节点的样式，创建另一个树 —- 渲染树。3、布局渲染树（Layout of the render tree）: 从根节点递归调用，计算

Study · 2014-04-22 · 312 人浏览
2011 - 2025 Ruxin·s Blog. All Rights Reserved.
Theme Jasmine