使用多个相互矛盾的css文件时的优先顺序
当在同一页面上使用多个css文件并且它们发生冲突时，我怎么知道哪一个将被使用？ 例如，如果一个人说蓝色的身体背景，另一个说红色。
快速回答：
如果两个CSS都具有相同的特性 （例如，它们都是body{ ），则无论哪一个被称为LAST，都将覆盖前一个。
但是，如果某些东西具有更高的特异性（更具体的select器），它将被使用，而不pipe顺序如何。
例1：
<div class="container"> <div class="name">Dave</div> </div> <style> .name { color: blue; } .name { color: red; } </style>
上面的例子会使颜色变红 。 两个select器是相同的，因此也具有相同的特征。 而且由于CSS自上而下，我们首先把它说成蓝色，但是我们通过告诉它“不要害怕，把它变成红色”来覆盖它。
例2：
<div class="container"> <div class="name">Dave</div> </div> <style> #container .name { background-color: blue; } .name { background-color: red; } </style>
上面的例子会使背景颜色为蓝色 ，即使蓝色是第一个，因为select器更“特定” 。
exception（使用!important ）：
包含！重要将覆盖特定性和顺序，但在我看来，只有在您试图篡改您无权访问的第三方代码时才能使用。
外部CSS：
覆盖规则在外部CSS文件上工作相同。 试想一下，把他们倒过来，从上到下。 在第一个文件中调用的select器将被任何后续文件中的相同特征select符覆盖。 但是，特异性仍然会在同一个文件或多个文件中胜过顺序。
如何testing：
在Chrome，Firefox和IE的现代版本（可能也是Safari）中，您可以右键单击某个东西，然后单击“检查元素”。 这将向您显示HTML以及任何应用的CSS。 在向下滚动CSS（通常在右侧）时，会看到划掉的东西 – 这意味着它们要么是不正确的CSS，要么被覆盖。 为了testing，您可以修改CSSselect器（无论是在您自己的代码中，还是在开发人员工具框中），使其更加具体，并查看是否会使其不被删除。 玩这个工具 – 这是非常有帮助的。
