Question

我想在一张有背景图片的桌子周围放一个边框。边框工作正常，但当我这样做（它是一个8px边框）时，背景图像被边框切断。我可以将背景图像移动到右侧8px并向下开始8px吗？

Answer 1

您可以使用background-position：

background-position: 8px 8px;

Answer 2

你也可以用一些简短的手 background: <colour> <image url> <repeat> <left> <top> <scroll>

对于你，我会想到这样的事情：
background : transparent url(<location to img>) no-repeat 8px 8px scroll;

Answer 3

您无需将图像手动移动8px，而应将图像锚定到填充框（下图中的 green ）而不是边框（ yellow） ）。这样做会将图像的左上角放在边框内，而不是在边框后。

background-origin: padding-box;

这将使维护更加容易，因为即使您更改边框宽度，它仍然可以工作。

您还可以将背景的原点设置为内容框（蓝色）：

background-origin: content-box;