Css 它是如何完成的-缩放推特按钮计数器

我想知道如何实现一个带有计数器元素的按钮，比如Tweet按钮。呼叫似乎随着位数的增加而增加；所使用的backgrund精灵的调出范围比基本按钮（即渲染的一位数按钮）中可见的调出范围要大得多

---

非常感谢您的帮助

关键是使用正确的背景位置。 它们使用两个元素：

<span><a href=#" >1</a></span>

这是呼叫的左侧。“0-50px”表示使用从顶部开始的部分精灵50px，从左侧开始的部分精灵0px

下一步设置锚定样式，技巧是这次将背景应用于元素的右侧：

a {
    background-img: url("sprite.png");
    background-position: right -50px;
    padding: 0 5px 0 0;
}

该背景与生长锚点的右侧对齐，左侧被切碎。 这样，实际上有两个图像在彼此的顶部，右侧在左侧的顶部，但它们实际上是精灵的相同部分。该数字只能增长到原始精灵的宽度，否则顶部锚定背景的左侧将可见

a {
    background-img: url("sprite.png");
    background-position: right -50px;
    padding: 0 5px 0 0;
}