我想为div设置一个背景图片，它位于div的上方 RIGHT 中，但距离顶部和右侧固定10px。
如果想要在div的上方 LEFT 中使用它，我会怎么做：
background: url(images/img06.gif) no-repeat 10px 10px;
无论如何都可以达到相同的效果，但是在 RIGHT 上方显示背景？
答案 0 :(得分：27)
在Firefox，IE9和Opera 10.5中，您可以使用四值语法specified in CSS3：
background-position: right 10px top 10px;
来源：MDN
答案 1 :(得分：15)
使用前面提到的规则以及上边距和右边距：
background: url(images/img06.gif) no-repeat top right;
margin-top: 10px;
margin-right: 10px;
背景图片仅出现在填充内，而不是边距。如果添加保证金不是一个选项，你可能不得不诉诸另一个div，虽然我建议你只使用它作为最后的手段尝试保持你的标记尽可能精益和sementic。
答案 2 :(得分：10)
有几种方法可以做到这一点。
如果可能的话，自己做数学。您已经知道图像的尺寸。如果您知道div的尺寸，您可以将图像放在（div宽度 - 图像宽度 - 10，div高度 - 图像高度 - 10）。
使用Javascript为您做繁重的工作。几乎与上面相同的方法，除了你不需要知道div本身的维度。 Javascript可以告诉你。
更糟糕的方法是在图像的顶部和右侧放置一个10px透明边框，并将位置设置为top right。
答案 3 :(得分：6)
我不知道纯css是否可行，所以你可以试试
background: url(images/img06.gif) no-repeat top right;
并修改您的图片，在顶部和右侧以透明色包含10px边框
答案 4 :(得分：1)
您可以使用百分比：
background: url(...) top 98% no-repeat;
如果您知道父div的宽度，则应该很容易确定需要使用的百分比。
答案 5 :(得分：0)
一种解决方案是绝对定位一个空div，然后给出背景。我不相信有一种方法可以纯粹使用CSS，不改变图像，并且在流畅的布局中没有额外的标记。
答案 6 :(得分：0)
您可以使用边框（以像素为单位）伪造右侧空间（大部分时间都是白色或者其他东西）
background-image: url(../images/calender.svg) center right
border-right: 5px white solid
答案 7 :(得分：-2)
正确的格式是：
background: url(YourUrl) 0px -50px no-repeat;
0px是水平位置，-50px是垂直位置。
CSS background-position接受否定值。