Html 为图像精灵使用带有百分比的背景位置

我试图在图像精灵中使用带有百分比的

背景位置

属性。但它似乎不起作用，也就是说，它不会移动背景图像

您可以在此处看到一个示例：

当我使用像素时，图像会移动：请看这里

我做错了什么

没错

像素的工作方式与背景位置的百分比不同。总结：背景位置：例如，30%10%将位于图像30%10%处的点与共包含DIV或HTML标记的30%10%轴对齐。不太明显，无法计算百分比

下一篇文章将对此进行解释：

背景位置：x%y%； 实际上，百分比背景位置的工作原理如下：

• 当横坐标为

  0%

  时，图像的左侧与容器的左侧对齐
• 当横坐标为

  100%

  时，图像的右侧与容器的右侧对齐
• 中间值是线性计算的

同样地

• 当纵坐标为

  0%

  时，图像的顶面与容器的顶面对齐
• 当坐标为

  100%

  时，图像的底面将与容器的底部对齐
• 中间值是线性计算的

---

---

见：@Diodeus谢谢。结果表明，在

背景位置

的百分比中，它以一种新的“非直觉”方式工作，糟糕透了。我得试试别的。