你们中许多人都知道我已经有一些时间在使用HTML / CSS。 自2006年以来，我一直在做这些事情。但是从那以后，很多事情发生了变化。 我像许多人一样学习CSS：通过阅读tut，然后做工作。 我从未坐下来冷静地理解CSS的内在精髓，因此，正如您可能期望的那样，我经历了你们所有人都经历过的同一件事：大多数时候，您发现CSS正在做您不了解的事情。 然后，您会责怪浏览器，或者感到生气和绝望，因为您只是不知道到底发生了什么，是什么导致了这种“错误”。 然后，您转到google或StackOverflow进行查找。
大多数时候，您会发现CSS正在做您不了解的事情。 然后，您会责怪浏览器，或者感到生气和绝望，因为您只是不知道到底发生了什么。
这些障碍非常痛苦，因为它们通常会花费大量宝贵的时间，而当您找到解决方案时，您已经尝试了很多事情，以至于您不再记得解决方案是什么，您就摆脱了“错误” ”。
就是这样，我已经感觉不到真正掌握CSS，也不知道是什么导致了我的“ bug”。 我决定完全控制自己的样式。 为了获得这个新的超级大国，我在白天和黑夜里都读了这本书https://www.manning.com/books/css-in-depth。
在这里，我将与您分享我的CSS历险记 。
级联
您可能已经认识这个人，您了解到这是C SS中的“ C”，但这实际上意味着什么？ 什么是级联？
CSS从根本上讲就是声明规则：在各种条件下，我们希望某些事情能够发生。
浏览器遵循我们定义的一组规则，因此结果是可预测的。 CSS开发人员的关键部分在于以可预测的方式编写代码。 因此，级联就是这组规则的名称。 它基本上决定了如何解决冲突。 换句话说，级联是浏览器用来解决声明中的冲突的机制。
让我们将其分解为基本组成部分：
级联（AKA规则集）考虑了解决冲突的四件事：
- 样式表来源
- 范围
- 选择器特异性
- 源订单
- 样式表来源是指样式的来源 。 这些样式是从用户代理样式应用（也就是浏览器默认加载的样式），还是从指导者样式 （也就是您编写的重写默认样式）应用。
- 范围将内联样式从选择器中应用的样式中筛选出来。
- 特异性确定哪个选择器优先于哪个选择器。
- 源订单是指在样式表中声明的订单样式。
这是一个简单的流程图，用于说明如何在较高级别应用这些规则：
第一部分就是这样。跟随我保持关注。 我明天将发布第二部分。 我将详细介绍级联的四个不同组件如何工作。 谢谢您阅读此篇！
如果您喜欢，请单击下面的so，以便其他人在中此看到此内容。
