使用repeat-y进行背景定位

Question

我有一个背景图像，它只是页面主要内容的包装。

我已将此图像设置为背景图像，如下所示：

#background {
    background: url("../image/bg.png") repeat-y 133px 50px;
    color: #000000;
    font-family: Arial,Helvetica,sans-serif;
    margin: 0;
    padding: 0;
}

我本以为这会将图像定位在距离左侧 133 像素、距离顶部 50 像素的位置，但它与浏览器顶部齐平。

谁能解释一下为什么这样做？

谢谢

当图像有repeat-y时可以完成这种位置吗？

谢谢

Answer 1

您正在使用repeat-y，因此背景会垂直重复，向下和向上。您指定的值 - 50px - 是原始背景开始的位置，但如果您的背景高度为 50px，您将不会注意到差异，因为它也会在其上方重复。