0

我的问题是为什么我不能在 gif 上更进一步并选择 position: -60px。我一直在尝试任何幸运...有什么建议吗？我想在 jsFiddle 上向您展示这个，但不知道如何将 gif 上传到网站。

<div id="container">
  <div id="mainContent">
    <h1> Main Content</h1>
        <div id="icon">

          <a href="#row_01" title="01A">01A</a>    </div>
    <h2>H2 level heading </h2>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent aliquam,  justo convallis luctus rutrum, erat nulla fermentum diam, at nonummy quam  ante ac quam. Maecenas urna purus, fermentum id, molestie in, commodo  porttitor, felis. Nam blandit quam ut lacus. Quisque ornare risus quis  ligula. Phasellus tristique purus a augue condimentum adipiscing. Aenean  sagittis. Etiam leo pede, rhoncus venenatis, tristique in, vulputate at, odio.</p>
    <!-- end #mainContent --></div>
<!-- end #container --></div>
</body>
</html>

CSS

#icon a
{
    background-image: url(../img/icon.gif);
    background-position: 0px 0px;
    background-repeat: no-repeat;
    display: block;
    overflow: hidden;
    text-indent: -99999px;



    width: 30px;
    height: 30px;
}

#icon a:hover, #icon a:focus
{
    background-position:  -30px 0;
}

#icon a.selected, #icon a.selected:hover

{
    background-position:  -60px 0;
}
4

1 回答 1

2

没有问题，只要图像实际上至少有 90 宽。

这是带有占位符图像的代码，以及selected单击图像时切换类的代码：

http://jsfiddle.net/wwRed/

于 2011-06-29T11:55:15.880 回答