0

我目前正在我的客户网站http://cjcdigital.net/clients/andrea上使用 CSS 导航系统，虽然顶部导航工作正常，但我无法在包含社交媒体的垂直侧边栏上重新创建翻转效果纽扣。

为了实现顶部导航效果，我按照以下步骤操作： http : //www.elated.com/articles/css-rollover-buttons/ 我的导航元素每个都堆叠在顶部/底部。

然而，对于侧面导航，尽管将 image:hover 设置为将精灵推到左侧，但 image hover 属性根本不会启动。

下面是顶部导航的一些代码，下面是侧面导航的代码。

#headerMenu {width: 1200px;}
#headerMenu ul{display: inline;}
#headerMenu li a{top:334px; position:absolute;}
#magazine
{
  display: block;
  width: 112px;
  height: 17px;
  background: url("./images/magazine.gif") no-repeat 0 0;
  left:160px;

}

#magazine:hover
{ 
  background-position: 0 -17px;
}

#magazine span
{
  position: absolute;
  top: -999em;
}

社交导航

#facebook
{
  display: block;
  width: 149px;
  height: 57px;
  background: url("./images/facebook.gif") no-repeat 0 0;
}

#facebook:hover
{ 
  background-position: -300 0;
}

#facebook span
{
  position: absolute;
  top: -999em;
}

提前感谢您的任何帮助

4

1 回答 1

1

您没有在 CSS 声明中为#facebook:hover. 您可能想做类似的事情：

#facebook:hover
{ 
  background-position: -300px 0;
}
于 2012-04-06T01:48:03.283 回答