浏览器怎么解析 CSS 样式? 下面给大家介绍一下浏览器解析 CSS 样式的过程. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.
解析
一旦 CSS 被浏览器下载, CSS 解析器就会被打开来处理它遇到的任何 CSS. 这可以是单个文档内的 CSS,<style > 标记内的 CSS, 也可以是 DOM 元素的 style 属性内嵌的 CSS. 所有 CSS 都根据语法规范进行解析和标记. 解析完成后, 就会生成有一个包含所有选择器, 属性和属性各自值的数据结构.
例如, 考虑以下 CSS:
- .fancy-button {
- background: green;
- border: 3px solid red;
- font-size: 1em;
- }
以上 CSS 片段将生成如下数据结构, 以便在后续的过程中方便使用:
值得注意的一件事是, 浏览器将 background 和 border 的简写还原成普通写法, 也就是一个一个属性的声明, 因为简单写主要方便开发人员的编写, 但从这里开始, 浏览器只处理普通写法. 完解析成之后, 浏览器引擎继续构建 DOM 树.
更多前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/css3/14697.html