如果你有一个固定宽度的元素，并且知道你的背景图像的宽度，你可以简单地设置background-position为:元素的宽度-图像的宽度-你想要在右边的间隙。

例如:对于一个100px宽的元素和一个300px宽的图像，要在右侧获得10px的间隙，您将其设置为100-300-10=-210px:

#myElement {
  background:url(my_image.jpg) no-repeat -210px top;
  width:100px;
}

你在元素的左边得到了图像最右边的80像素，在右边有一个20px的间隙。

我知道这听起来很愚蠢，但有时它节省了时间……我用垂直的方式(在底部的差距)导航链接与文字下面的图像。

但不确定这适用于你的案子。

最简单的解决方案是使用百分比。这并不是您想要的答案，因为您要求的是像素精度，但如果您只是需要在右边缘和图像之间有一些填充，那么给出99%的位置通常就足够了。

代码:

/* aligns image to the vertical center and horizontal right of its container with a small amount of padding between the right edge */
div.middleleft {
  background: url("/images/source.jpg") 99% center no-repeat;
}

过时的答案:它现在在主要浏览器中实现，请参阅 这个问题还有其他答案。

CSS3修改了背景位置的规格，使它可以在不同的原点上工作。不幸的是，我找不到任何证据表明它已经在任何主流浏览器中实现。

http://www.w3.org/TR/css3-background/#the-background-position 参见例12。

background-position: right 3em bottom 10px;

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

background-position: 100% 0px;

如果我明白你的要求你会这样做;

你有一个名为#main-container的DIV容器和其中的。my-element。用这个来开始吧;

#main-container { 
  position:relative;
}
/*To make the element absolute - floats above all else within the parent container do this.*/
.my-element {
  position:absolute;
  top:0;
  right:10px;
}

/*To make the element apart of elements, something tangible that affects the position of other elements on the same level within the parent then do this;*/
.my-element {
  float:right;
  margin-right:10px;
}

顺便说一下，如果您在页面中引用较低级别的元素，最好使用类(我假设您因此而更改了上面的名称)。

我的问题是，当窗口调整大小时，我需要背景图像与右侧边界保持相同的距离，例如平板电脑/手机等 我的解决方案是像这样使用一个百分比:

background-position: 98% 6px;

它会固定在原地。