4

这篇文章（尽管它是基于一个给我的工作带来麻烦的事实）更多的是一个哲学问题，而不是一个真正的问题提交。

我偶然发现了以下令人费解的案例...

这不是一个真正的问题，因为我（认为我）理解这种现象，它是如何被统治的以及它所产生的影响。

我做了以下示例：http: //jsfiddle.net/q7xAn/尽可能描述性。

在这种情况下，为什么（Ô神为什么）跨度有黄色背景？

我不知道哪个规则适用它，但更多的是：以哪个扭曲的名义（与我一直假设的相反），最后一个声明的规则是否适用于第一个声明的规则？

我的意思是“.red span”和“.yellow span”具有相同的复杂性。

  • 相同长度
  • 给定位置的每个项目具有相同的权重/重要性

它们在 css 选择器自然顺序中是等价的。

那么在哪个适用的问题上应该占主导地位的是哪个规则最接近样式项目。在我的示例中，跨度应使用“.red span”（最接近规则）而不是“.yellow span”（这也是正确的，但被“.red span”“覆盖”）设置样式。

这种行为是否有任何“历史”、“政治”、“哲学”或任何其他原因？一些 DOCTYPES （可能是？）可能会迫使我关注的行为？我可以向 w3c 提交请求吗（为什么不呢？）？如何 ？任何信息，建议，不同的观点，都非常欢迎！

提前谢谢大家。

Edit note :

我讨厌引用自己的话，但在对 aymeric 的评论中，我想出了一个很好的方法来解释我的提问到底是关于什么的。

一般来说，让我烦恼的是，如果我有，假设有 7 种配色方案（每种彩虹色一个）。

还假设我是一个（比如说）10 人的团队的 CSS 制作者。

我希望他们（我的团队）能够嵌套颜色方案的块。

  • 在一种情况下，红色块将容纳黄色和洋红色块。
  • 在另一种（有趣的）情况下，需要有 7 层嵌套（红色嵌套在橙色中，黄色嵌套在 ...）。

我现在无法知道将需要事先使用哪些用途。

当前的 CSS 经验行为将迫使我每次出现新的嵌套需求时都修改我的 CSS，并最终导致令人讨厌的过度臃肿的规则。
就可维护性而言，这是一个暴行:'(

4

2 回答 2

2

它被称为specificitycss。如果两个选择器与特定元素匹配并且它们具有相同weight的 ，则出现的选择器将later应用于该元素。

阅读此内容以获取更多信息。

您的选择器.red span和.yellow span两者都具有权重0,1,1（我提到的链接将详细解释如何计算权重），因此应用了最后一条规则。

另请阅读W3 中的这篇文章，这将更好地解释事情。

希望所有这些都有意义:)

于 2012-09-12T08:51:39.107 回答
0

Here is an article (not really recent but explicit) which explains (if I didn't misunderstood your questions) answers your looking for.

For example, if you replace:

.red span, .red{
background-color: #F00
}

by:

.yellow .red span, .red{
    background-color: #F00
}

Your background will be red.

Regards.

于 2012-09-12T08:32:11.970 回答