应用较低的特异性样式，而不是更高的特异性悬停

Question

正如你在这里看到的：

正在应用选择器.wrapper-dropdown .label，而不是更高的特异性.wrapper-dropdown .dropdown li div.liwrap:hover

为什么？ 我在osx 10.8上使用chrome，如果那是相关的

-edit

此Less：http://hastebin.com/feyurojusa.avrasm
汇编到这个css：http://hastebin.com/dihimuquju.css

此Jade：http://hastebin.com/sipetaqigu.vhdl
编译为此html：http://hastebin.com/sufavolumo.xml

另外，我有一个小型JavaScript处理点击事件：http://hastebin.com/sufavolumo.xml

Answer 1

.label指定的元素与div.liwrap指定的元素不同;相反，.label是div.liwrap的后代之一。然后，特异性变得无关紧要，因为选择器完全匹配不同的元素。

删除线只是意味着div.liwrap祖先的color被取消而不是被继承，因为你给.label个color声明。

如果您想让.label在悬停时从div.liwrap继承，则需要在LESS代码中修改以下规则：

  .dropdown li div.liwrap:hover {
    border-color: #00aeef;
    color: #00aeef;
  }

对于这样的事情：

  .dropdown li div.liwrap:hover {
    border-color: #00aeef;
    color: #00aeef;
    .label {
      color: #00aeef; // Or color: inherit;
    }
  }