悬停时无法更改 Div 背景颜色答案

【问题标题】：Can't Change Div background Color on Hover悬停时无法更改 Div 背景颜色
【发布时间】：2013-11-25 23:44:56
【问题描述】：

我将文本放在 DIV 中。我希望 DIV 的背景颜色和边框颜色在悬停时更改，如果该 DIV 是当前的，我还希望更改背景。

目前所发生的只是 DIV 背景中的文本在悬停时发生变化。

这是我的 CSS：

#article_pagination{
float: left;
padding: 0px 4px 0px 4px;
margin: 0px 3px 0px 0px;
border: 1px solid #999999;
display:block;
}

#article_pagination :hover{
background-color: #99FFFF;
border: 1px solid #666666;
}

#article_pagination :current{
background-color: #99FFFF;
}

这是我的 HTML

<div id="article_pagination">
Some text here
</div>

【问题讨论】：

标签： css hover

【解决方案1】：

你需要把:hover和:current前面的空格去掉。变化：

#article_pagination :hover{
background-color: #99FFFF;
border: 1px solid #666666;
}

#article_pagination :current{
background-color: #99FFFF;
}

到：

#article_pagination:hover{
background-color: #99FFFF;
border: 1px solid #666666;
}

#article_pagination:current{
background-color: #99FFFF;
}

演示：http://jsfiddle.net/R6cHc/

【讨论】：

【解决方案2】：

删除#article_pagination :hover中的空格

#article_pagination:hover{
    background-color: #99FFFF;
    border: 1px solid #666666;
}

#article_pagination:current 也一样，但没有 :current AFAIK，而是 :active，它是用于 link。 Working Here.

【讨论】：

【解决方案3】：

删除选择器和悬停 #article_pagination :hover之间的空格应该是 #article_pagination:hover但是在css中没有:current。你可以在这里使用:active。

请粘贴您想要使用的完整代码:current

#article_pagination:hover{
  background-color: #99FFFF;
  border: 1px solid #666666;
}

Demo

您不能在 div 中检查 :active。如果你想在 div 上点击改变背景颜色，那么你必须使用 jquery。

【讨论】：

谢谢。这适用于悬停。如何在活动/当前时更改背景？