将鼠标悬停在div上可以在Firefox中使用

时间:2011-06-03 10:35:39

标签: css firefox4

我有这段代码:

<div title="" class="icePnlGrp graButtonActionDiv graButtonBackgroundOn">
       <label id="j_id89:j_id99" class="iceOutLbl graButtonActionLabel">Select</label>
</div>

使用css:

.graButtonBackgroundOn {
line-height: 45px;
background:
    url('/resources/images/external/button_generic_on_txmart.png');

}

.graButtonBackgroundOn:hover{
background:
    url('/resources/images/external/button_generic_on_txmart-hover.png');

}

我无法弄清楚为什么在Firefox和IE上,徘徊在那个div上并没有改变背景图像....但是在Chrome上它的效果非常好。

你能帮我一下吗?

感谢。

1 个答案:

答案 0 :(得分:4)

尝试将:悬停样式规则赋予其正常状态更具特异性,因此:

.graButtonBackgroundOn {
line-height: 45px;
background:
    url('/resources/images/external/button_generic_on_txmart.png');
}
div.graButtonBackgroundOn:hover{
background:
    url('/resources/images/external/button_generic_on_txmart-hover.png');
}

将覆盖原始样式规则