：onhover伪类无法按预期工作

Question

我已经编写了一段代码，我将其放在缩小的CSS部分之上：

.scroll-fixed-navbar {
  background-color: black !important;
}

.banner-list li i {
  color: #f86900 !important;
}

.btn-primary {
  background-color: #f86900 !important;
}

#nav li a {
  color: #f1861d !important;
}

#nav li:hover {
  color: #a8a89b !important;
}

[Huge chuck of minified code containing Font Awesome and Twitter Bootstrap]    

在一台服务器上按预期工作，链接项在悬停时淡化为灰色。但是，在另一台服务器上，不会触发悬停效果。我尝试在检查器中打开li元素，但即使在效果正常的服务器上，CSS也不会显示出来：

我在某处看到:hover伪类只应该应用于a元素，但我查看了W3C wiki，并且没有提到它。我可以用这种方式将:hover应用于锚的li父级，还是非法代码？可能Bootstrap和/或Font Awesome代码会覆盖CSS吗？或者问题可能是由其他原因造成的？

Answer 1

我想这个：

#nav li a {
  color: #f1861d !important;
}

覆盖了这个：

#nav li:hover {
  color: #a8a89b !important;
}

为什么要在:hover上设置li？尝试在a：

之后定位li:hover元素

 #nav li:hover a {
  color: inherit !important;
}