Question

我最近遇到过CSS Sprites的一些问题。我希望他们在每个函数调用时切换图片，函数本身就可以了，因为它只删除并添加了css类。

我有以下CSS：

#slider_arrow {
    padding-left: 200px;
    position: relative;
    top: -1px;
}

.red_arrow_sprite {
    background: url(/Images/onex/arrows.png) 0 0 no-repeat;
    width: 25px;
    height: 12px;
}

.yellow_arrow_sprite {
    width: 25px;
    height: 12px;
    background: url(/Images/onex/arrows.png) -26px 0 no-repeat;
}

.black_arrow_sprite {
    width: 25px;
    height: 12px;
    background: url(/Images/onex/arrows.png) -51px 0 no-repeat;
}

Slider_arrow是：

<span id="slider_arrow" class="red_arrow_sprite"></span>

我改变类的元素。

问题是我的Sprite文件宽度为75px，高度为25px。（3x 25px / 25px）通过我提交的CSS，我得到了结果，我用red_arrow_sprite类看到了所有3张图片，带有yellow_arrow_class的2张图片和带有black_arrow_class的1张图片。

我对CSS做错了什么？提前谢谢。

http://jsfiddle.net/9b57pb50/

Answer 1

查看此solution

我已删除padding并添加了一些display属性。

Css精灵错位

1 个答案: