我有以下CSS规则：
.bookItem:hover { background: rgba(0,150,255,0.1); }
.selected { background: rgba(0,150,255,0.2) !important; }
单击bookItem时，我使用jQuery将选定的类添加到其中。麻烦的是，没有!important所选的类在鼠标不再悬停之前不会显示。我知道这是因为：hover伪类使这个选择器“更具体”。
是否可以更改.selected类以使其优先于：bookItem：hover 而不 !important？
答案 0 :(得分：3)
嗯，在我看来，你应该重新考虑使用这个css关键字。 ！important是一个功能太强大的工具，它主要破坏了css所有的层次结构，使得调试代码非常困难。当没有出路时，它的用法应限于少数极端例子。
同样，在我看来，你应该尝试使用尽可能多的html标签，然后使用类和id，最后是css上的特定属性。我会像我的同伴建议的那样去写作课：
.bookitem.selected { back... ; }
最后，有关其他信息，请参阅this post at smashing magazine
答案 1 :(得分：2)
我建议将.selected的特异性更改为.bookItem.selected
答案 2 :(得分：2)
使.selected课程更加通用，因此它可以放在任何地方而不仅仅是.bookItem个元素，它可以帮助我在悬停时强制.selected样式
.selected,.selected:hover { background: rgba(0,150,255,0.2)}
答案 3 :(得分：1)
这是一个特异性问题。在你的样式表中定义.selected如此
div item#books .selected {bacground: rgba(0,150,255,0.2);}