本篇内容介绍了“CSS元素选择器是如何运作的”的有关知识，在实际案例的操作过程中，不少人都会遇到这样的困境，接下来就让小编带领大家学习一下如何处理这些情况吧！希望大家仔细阅读，能够学有所成！
创新互联主营正宁网站建设的网络公司,主营网站建设方案,app软件开发,正宁h5微信平台小程序开发搭建,正宁网站营销推广欢迎正宁等地区企业咨询
在前端工程师的日常工作中，使用 CSS 元素选择器是稀松平常的事；无论你是编写一般的 CSS 还是需要经过编译的 SASS，SCSS，LESS等，最终都被编译成一行一行的 CSS 样式属性，最终交给浏览器解析并套用。但是你想过没有这是如何实现的呢?
浏览器渲染
我们先看一下浏览器的渲染步骤：
CSS 在被浏览器加载后，会被解析成 CSSOM 树，并尝试与 Dom 叠加成渲染树，随后进行计算位置、渲染等步骤。这样看来，CSS 属性套用的关键就在于如何从 CSS 转化成 CSSOM 树，以及怎么把 CSSOM 套用到 DOM 上去。
CSSOM树
当我们写下一组 CSS 样式时，例如：
#id .class h5 + p { ... }浏览器在解析它时，你可能会认为 CSS 会按照由左到右的依序找出#id>.class>h5>p，最后套用，但实际上浏览器解析 CSS 的顺序是由右到左的 p>h5>.class>#id。
很违背直觉对吧?但如果考虑到性能问题，从右到左的解析会比从左到右强很多。
假设这有这样的 HTML：
