CSS：如果选中则不悬停答案

【问题标题】：CSS: no hovering if selectedCSS：如果选中则不悬停
【发布时间】：2012-12-26 14:59:07
【问题描述】：

这听起来很简单，但我是这方面的新手。

input.input-text:hover {color:red}
input.input-text:focus {color:blue}

如果input-text 被聚焦，我希望它在悬停时不能变成红色。我们可以这样做吗？

【问题讨论】：

在某些情况下，您还可以使用 :not() 选择器。 w3schools.com/css3/default.asp 和 w3schools.com/css/default.asp
这应该可以按预期工作而无需修改。如果它同时处于焦点和悬停状态，则焦点将优先，因为它出现在最后（并且两个选择器具有相同的特异性）。
您当前的代码应该如您所描述的那样工作。在 IE9、FF 和 Chrome 中测试：jsfiddle.net/jXLtR
请测试我的答案，谢谢。
乔恩，Shmiddty，谢谢大家，我的错！！！！作品:)

【解决方案1】：

我会使用 jquery 来完成此操作，因为您正在尝试有条件地设置 css。你可以保留你的css，然后在你的html页面上添加它

$("input.input-text:focus").hover().css('color', 'black');

如果您还没有包含 jquery 脚本，请将其添加到文档的头部：

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

【讨论】：

【解决方案2】：

你可以堆叠伪类

input.input-text:focus:hover {
  color:green;
}

【讨论】：