Javascript 如何更改鼠标上方的图像按钮

我想在翻滚时将图像按钮从绿色更改为黄色

这是我的CSS代码

 a#try-it-button {
    width:273px;
    height:47px;
    margin-left:25px;
    margin-top:372px;
    background:url(../image/try-it-green.png);

}
a#try-it-button:hover {
        width:273px;
    height:47px;
    margin-left:25px;
    margin-top:372px;
    background:url(../image/try-it-orange.png);
}
a.alt { display: none; }

我的html代码

<div id="y-moringa">


<a id="try-it-button" href="#"><span class="alt"></span></a>

</div>

---

提前感谢。

未经测试，但试一试：

a#try-it-button {
    width:273px;
    height:47px;
    margin-left:25px;
    margin-top:372px;
    display:block; // <-- **I added this**
    background:url(../image/try-it-green.png);

}
a#try-it-button:hover {
    background:url(../image/try-it-orange.png);
}

a#试试按钮{
宽度：273px；
高度：47px；
左边距：25px；
边缘顶部：372px；
display:block；//将
float:left
或
display:inline block
或
display:block
添加到
a#try it按钮

你想要哪一个取决于你想要的布局

您不需要复制
：hover
上的所有属性（新的
背景除外）

实际上，您应该在这里使用（有很多好处）并调整
上的
背景位置：悬停
以什么方式不起作用？如果链接（
a
）有可见内容，那么应该只使用CSS。