在锚标记使用不同的图像（链接，访问等）

我试图让不同的图像，以示对一个锚标记的不同状态，但我不能得到它的工作。关于我在这里失踪的任何想法？在锚标记使用不同的图像（链接，访问等）

这里的图像=>不会让我张贴的图像，但它是480x30像素

这里的CSS;

a.image { 
background-repeat:no-repeat; 
color:white; 
display:inline-block; 
width:160px; 
height:30px; 
margin-left:-12px; 
margin-top:16px; 
padding-top:6px; 
text-align:center; 
font-size:14px; 
font-weight:bold; 
cursor:pointer; 
text-decoration:none; 
} 

a.image:link { 
background-image:url('images/buttons.png'); 
background-position:0px 320px; 
} 

a.image:visited { 
background-image:url('images/buttons.png'); 
background-position:0px 0px; 
} 

a.image:active { 
background-image:url('images/buttons.png'); 
background-position:0px 160px; 
}

这里是HTML;

<a href='ifp.asp?width=1512&ProjectGroupID=&ProductID=536&model=Addison 536&plan=Lower Level Plan' class='image'>Lower Level Plan</a>

我目前只获得白色文本中的“低层计划”。谢谢！

来源

2012-08-15 user1601513

你所说的“低级别”是什么意思？ – 2012-08-15 19:39:13

'background-position'属性被定义为'Xpos Ypos'。你确定你不应该扭转你的价值观的顺序吗？ – Quantastical 2012-08-15 19:40:49

您在y轴改变你的背景，职位时，你应该在X轴会改变他们，如果你的精灵是480×30 H.你也应该使用-X尺寸来表示精灵的需要在负方向偏移（向左），这样你可以重写这样的：

a.image:link { 
background-position:-320px 0px; 
} 

a.image:visited { 
background-position:0px 0px; 
} 

a.image:active { 
background-position:-160px 0px; 
}

请注意，这里我也去掉了背景图片的声明，你可以简单地移动这件事到A.图形样式块。

来源

2012-08-15 19:41:15

我改成了你的建议，我仍然不能得到它的工作。我添加了另一行内嵌样式，此按钮确实显示，但没有显示其他按钮。这是行的工作; Reset – user1601513 2012-08-15 20:47:58

哪里像位于相对于在目录结构中的CSS？它位于CSS所在目录的images子目录中吗？如果在CSS文件中使用相对URL引用。该路径相对于CSS文件的位置。 – 2012-08-15 20:50:54

CSS和图像都是程序所在位置的子目录。我把它改成了这个，background-image：url（'../ images/buttons.png'）;,但仍然没有运气。 – user1601513 2012-08-15 21:01:23

在锚标记使用不同的图像（链接，访问等）

回答

相关问题