Html 更改图标标记的css精灵位置

我正在尝试更改悬停图标标签的背景位置。若它是在图标标签中而不是在标签中，我该怎么做呢

html图标标记为：

<a class="info" href="#"><i class="tag"></i> Info</a>
<a class="info" href="#"><i class="other_tag"></i> Other Info</a>

---

图标的宽度实际上是13像素宽，31像素高

只需像这样放置嵌套规则：

.info:hover .tag {
  /* Put a different background position */
}

.info:hover .other-tag {
  /* Put a different background position */
}

---

我给出了一个答案，但我不确定这是否是你所问的。如果是，请告诉我，我将删除答案。

.info:hover .tag {
  /* Put a different background position */
}

.info:hover .other-tag {
  /* Put a different background position */
}