如何实现图像按钮的悬停效果？

Question

如何获得具有悬停效果的图像按钮？我有两个按钮图像，一个很简单，另一个是悬停？

Answer 1

您可以在CSS中轻松完成。

input[type='button']:hover
{
    color: #00a;
    //or background-image: url("url");
}

Answer 2

你可以使用精灵图像轻松地使用css，并根据它是否悬停来移动背景图像。

的CSS：

a { display:block; width: 80px; height: 40px; background: url(bgImage.png) top;
a:hover { background: url(bgImage.png) bottom; }

您必须将“简单”和“悬停”图像合并为一个图像，才能实现此目的。