CSS特异性 - 跨浏览器问题

Question

这对我来说是一次学习练习，所以提前感谢不要告诉我为什么我不想做以下事情。我不想做，我想明白。

给出以下CSS：

input[type="file"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

input[type="checkbox"]:focus {
    outline: none;
}

两者的特异性显示为0,2,1，我读到的关于CSS的所有内容都说第二种风格应该覆盖第一种风格，因为它最后一次。如果我对第二种风格有更具体的了解，那就赢了。但是发布后，Chrome不会显示大纲，但IE11和FF28会显示。在我看来，这是一个基本上简单的CSS应用程序。有没有人对底层问题有什么了解，以便我可以在我开发样式表时将其纳入思路？

编辑：如果删除第二种样式，Chrome也不会显示大纲。在Chrome中，轮廓：细点由以下轮廓线覆盖。因此看起来按照规范，Chrome正在按照这本书来玩，FF和IE不是吗？它可能是浏览器解释CSS的联合与覆盖差异吗？

Answer 1

道歉，错误是我的。当我从bootstrap.min.css切换到bootstrap.less时，我没有删除前者加载，所以最后加载并覆盖我的Site.less - ＆gt;的site.css。在我试图创造一个小提琴之后我想出来了，我本来应该做的。请按照应有的方式将这篇文章下载到地狱。