！! 过时的答案，因为CSS3带来了这个功能

有一种方法来定位背景图像从其元素的右边一定数量的像素?

不。

流行的变通方法包括

改为在元素上设置右边距 为图像本身添加透明像素，并将其定位在右上方 或者在元素宽度已知后使用jQuery计算位置。

这将适用于大多数现代浏览器…除了IE(浏览器支持)。尽管该页面列出了支持>= IE9，但我的测试并不同意这一点。

你可以像这样使用calc() css3属性;

.class_name {
    background-position: calc(100% - 10px) 50%;
}

对我来说，这是最干净、最合乎逻辑的方式来实现向右的边缘。我还使用了border-right: 10px solid transparent;IE。

是的!好吧，把背景图片从浏览器的右边定位成0px，而不是左边-我使用:

background-position: 100% 0px;

如果你想使用这个添加箭头/其他图标到一个按钮，那么你可以使用css伪元素?

如果它真的是整个按钮的背景图像，我倾向于将间距合并到图像中，并使用

background-position: right 0;

但如果我必须添加一个设计的箭头到一个按钮，我倾向于有这样的html:

<a href="[url]" class="read-more">Read more</a>

并倾向于用CSS做以下事情:

.read-more{
    position: relative;
    padding: 6px 15px 6px 35px;//to create space on the right
    font-size: 13px;
    font-family: Arial;
}

.read-more:after{
    content: '';
    display: block;
    width: 10px;
    height: 15px;
    background-image: url('../images/btn-white-arrow-right.png');
    position: absolute;
    right: 12px;
    top: 10px;
}

通过使用:after选择器，我使用CSS添加了一个元素来包含这个小图标。您可以通过在a元素中添加span或<i>元素来实现同样的目的。但我认为这是一种向按钮添加图标的更简洁的方式，而且它是跨浏览器支持的。

你可以在这里查看小提琴: http://codepen.io/anon/pen/PNzYzZ

如果你有比例元素，你可以使用:

.valid {
    background-position: 98% center;
}

.half .valid {
    background-position: 96% center;
}

在这个例子中，.valid将是带有图片的类，而.half将是只有标准行一半大小的行。

有点脏，但很有魅力，而且还可以控制。

最合适的答案是background-position的新四值语法，但在所有浏览器都支持它之前，最好的方法是按照以下顺序组合之前的响应:

background: url(image.png) no-repeat 97% center; /* default, Android, Sf < 6 */
background-position: -webkit-calc(100% - 10px) center; /* Sf 6 */
background-position: right 10px center; /* Cr 25+, FF 13+, IE 9+, Op 10.5+ */