优先

Question

我看到：

• CSS 2, precedence of stylesheets imported using link element
• In which order do CSS stylesheets override?
• stylesheet - Can one CSS file take priority over another CSS file?

他们都好像说的是，对于相同的选择发生多次，最后一个胜。但是，这不是我所遇到的。因此，考虑到 “Aqua.css” 有：

body {color:aqua;} 

和 “Red.css” 有：

body {color:red;} 

然后使用以下：

<link rel="stylesheet" type="text/css" href="Aqua.css" title="Aqua"/> 
<link rel="stylesheet" type="text/css" href="Red.css" title="Red"/> 
<style type="text/css"> 
body {color: lime;} 
body {color: yellow;} 
</style> 

最后一个，黄色，正如其他答案所说的那样。如果我改变，但是：

<style type="text/css"> 
body {color: lime;} 
body {color: yellow;} 
</style> 
<link rel="stylesheet" type="text/css" href="Aqua.css" title="Aqua"/> 
<link rel="stylesheet" type="text/css" href="Red.css" title="Red"/> 

然后使用Aqua，而不是最后一个，红色。见Precedence of CSS rules Sample 2。体色是水族但Aqua.css是Red.css之前。所有我找到的答案说，车身颜色将是红色。

每当我有多个链接到CSS样式表和它们之间唯一的区别是什么颜色（元素或类或其他），则使用第一样式表，而不是最后，但似乎不是我读过的每一样东西都应该发生。我曾尝试Edge，Chrome和IE;我注意到他们之间没有相关的区别。

所以，我有以下两个问题：

• 我是正确，我看到的行为（第一个链接标签被用来代替过去的）是从其他的答案有什么不同？
• 如果是这样的话，为什么？

我很抱歉如果我应该发布了其他线程之一的答案，但我认为创建一个新问题更为清晰。

的原因，我问的是，我想创建一个动态的系统样式这么理解的优先级是更重要的，它是不那么有效，只是试一下，看比在正常情况下，是什么在起作用。我将试图解释规范，但到已经在其他的答案的程度，我想了解什么已经在其他线程这里提供。

Answer 1

_{声明：我以前的答案和思路是完全错误的，所以我删除了它，并将其作为替代品发布，以免与前面任何讨论混淆。}

当您给<link>元素title属性时，您将其定义为备用样式表集。

<link rel="stylesheet" type="text/css" href="Aqua.css" title="Aqua"/> 
                 ^^^^^^^^^^^^ 
<link rel="stylesheet" type="text/css" href="Red.css" title="Red"/> 
                 ^^^^^^^^^^^ 

样式的优先级是一个红色的鲱鱼。Red.css样式根本不会被应用，因为该样式表集当前未处于活动状态。

Per the spec：

此外，title属性有这个元素的特殊语义：链接的标题;替代样式表集名称。

另外值得一读："CSS: alternative style sheets"：

的文件并不需要有一个单一的样式表。您可以给它一个默认样式和任意数量的替代品供读者选择。例如，该页面可以替代所有的W3C Core Style，以及Web上其他地方的两个样式表（作者：David Baron）。

读者如何选择替代品取决于浏览器。并不是所有的浏览器都提供了一个菜单，但很多都可以。例如，在Opera，Internet Explorer和Firefox中，您可以在“查看”菜单下找到样式。从2012年起，Chrome需要扩展程序（例如Decklin Foster的Style Chooser）。

你应该定义替代样式表时使用rel="alternative stylesheet"，但是这似乎是在浏览器的预期行为的情况。删除title属性和<link>元素返回到规范中定义的标准行为。