CSS翻转小精灵

问题描述：

我以前用过这个效果，一切都按顺序（就我所见），但它不起作用。我错过了什么？CSS翻转小精灵

感谢。

答

因为你的精灵水平设置，你会想，以抵消悬停状态是这样的：

element:hover { 
background-position: -77px 0; 
}

请注意，交换订单和负值。两者都需要。 – kingjeffrey 2010-04-14 10:23:36

这是我一直犯的一个错误。我只是回想起高中几何和所有这些（x，y）坐标。背景位置具有相同的顺序。 – kingjeffrey 2010-04-14 10:26:01

答

恩，你的背景位置是调整顶端开始位置而不是左侧起始位置？

答

你的背景偏移似乎是错误的 - 而不是0 77px（这是y偏移量，沿错轴），尝试-77px 0

答

只是改变

background-position: 0 77px;

到

background-position: -77px 0;