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

例如,要将某个东西从左边定位一定数量的像素(比如10),我是这样做的:

#myElement {
    background-position: 10px 0;
}

当前回答

一个简单但肮脏的技巧是简单地添加你想要作为背景的图像的偏移量。它是不可维护的,但它可以完成工作。

其他回答

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

background-position: 100% 0px;
background-position: calc(100% - 8px);

一个简单但肮脏的技巧是简单地添加你想要作为背景的图像的偏移量。它是不可维护的,但它可以完成工作。

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

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

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

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

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

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

使用中心右边的位置,然后添加一个透明的边界来抵消它?