0

我有一个模仿旧磁带机的菜单。每个列表项都有一个按钮的背景图像。选择项目时,新的背景图像在向下位置显示按钮。但是,我仍然可以看到下面的另一张图片。如何将原始图像替换为所选图像。请参阅http://www.saintalvia.com了解我的意思。

谢谢!

#access a { 
font-family:Roboto;
text-transform:uppercase;
font-size:12px;
padding: 0 9px 2px 9px;
-moz-border-radius:0 0 0 0 !important;
-webkit-border-radius:0 !important;
-webkit-border-radius:0 !important;
border-radius:0 !important;
border-radius:0 !important;
}

#access .menu-header li,
div.menu li {
margin-top:0px;
height:80px;
}

#access ul li {
margin-right:8px;
background-repeat:no-repeat;
background-position:bottom;
background-image:url(http://www.saintalvia.com/wp-content/uploads/2013/02/newButton.png);
}
#access ul li.current_page_item > a,
#access ul li.current-menu-ancestor > a,
#access ul li.current-menu-item > a,
#access li.selected > a,
#access ul li.current-menu-parent > a,
#access ul li.current_page_item > a:hover,
#access ul li.current-menu-item > a:hover {
height:80px;
background-color:transparent;
background-repeat:no-repeat;
background-position:bottom;
background-image:url(http://www.saintalvia.com/wp-content/uploads/2013/02/buttonDownNew.png)
}
4

3 回答 3

3

您在 上设置了“向上”图像,在 上<li>设置了向下图像<a>。将电流设置为向下<li>而不是<a>

为了改进这一点,我还将按钮的向上和向下版本组合到一个图像中,以创建所谓的 CSS 精灵。然后,当您想将按钮移到向下位置时,您需要做的就是调整background-position.

于 2013-02-26T21:30:16.583 回答
0

您在标签上有一张图片,在a标签上有一张图片li,因此当页面转到您单击的链接时,您应该更改之前所在标签上的图片,而不是将其添加到另一个标签的顶部。任何一个标签都应该工作,你只需要选择一个。

于 2013-02-26T21:31:51.103 回答
0

看起来li有向上按钮的背景和li a向下按钮的背景。

于 2013-02-26T21:33:38.073 回答