标准按钮的 CSS 和 Sprites

Question

我想在网站上使用一组标准按钮，而不管其中写了什么(即提交、支付、开始、拼写正确)，但由于某种原因我无法显示 sprite 图像。我的代码如下:HTML:

    <div id="iconic">
    Place Sprite button here <span><a class="button" href="#">Test</a></span>
    </div>

CSS:

    span.iconic a:link
    span.iconic a:visited
    {
    display: block;
background-image:url('images/an_nav_btn.jpg');
width: 150px;
height: 45px;
    }
    span.iconic a:hover
    {
background-position: 0 -50px;
}
    span.iconica a:active
    {
background-position: 0 -100px;
}

关于如何让它显示在顶部的文本的任何建议(在这种情况下，它将有一个带有“测试”一词的按钮。

提前致谢。

Answer 1

根据您发布的 css，您正试图在具有“iconic”类的跨度内操作链接...并且这不适用于您在 html 中的内容:

为了让你走上正轨，试试替换所有 span.iconic的与 #iconic span的

#iconic span a翻译成“所有 <a> 都在一个 <span> 内，在任何 ID 为‘iconic’的元素内”