如何转移与CSS背景图像

Question

我想放一个边框具有背景图片的表。边境工作正常，但是当我这样做（这是一个8像素境）的背景图像获取由边界切断。我是能够移动的背景图像来启动8像素向右和向下8像素？

Answer 1

可以使用背景位置：

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手动移位图像，你应该只是将图像锚固到填充盒（绿色下图），而不是在边界框（黄色 ）。这样做将图像的左上角放置边界内，而不是它的后面。

background-origin: padding-box;

如果您更改边框的宽度这将使得维护更加容易，因为它仍然会更加。

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

background-origin: content-box;

文档/简单的演示@ MDN