Question

如何在精灵的链接文本右侧显示外部链接图标？

修改使用：在psudo之后：

a.external:after {
    width:12px;
    height:12px;
    content:url(../img/icons/ico_sprite.png) no-repeat -985px -3px;
}

这会在链接后加载精灵，但不会裁剪到所需的图标。任何更多额外的领导将非常有帮助....

我的HTML：

<a class="external_ico" href="">myLink</a>

和CSS：

a.external_ico {
    width:12px;
    height:12px;
    background: url(../img/icons/ico_sprite.png) no-repeat -985px -3px;
}

显示器：

[＆GT;] myLink的

但我需要的是：

myLink [＆gt;]

我也试过这个CSS：

a.external_ico {
    width:12px;
    height:12px;
    background: url(../img/icons/ico_sprite.png) center right no-repeat -985px -3px;
}

但显示：

myLink的

如果我没有从精灵中获取图标但是我有很多图标并且想要从精灵中获取这个图标，我没有任何问题。任何帮助，将不胜感激。日Thnx。

Answer 1

只需在a元素

右侧添加填充

a.external_ico {
    padding-right: 12px;
    background: url('http://www.placehold.it/12x12') center right no-repeat;
}