css - 背景位置 : -209px -2px, 我不明白负背景位置

Question

如果我有一个 1000x3000 像素的图像并且我使用负背景位置，这究竟是如何工作的？

我认为它的工作原理是向左移动 209 像素，然后向上移动 2 像素，然后显示实际剩下的部分，但它似乎与此相反。

Answer 1

Background position 属性实际上是相对于元素移动背景图像本身。例如，如果您使用 {background-position: 0 0} 这意味着您将图像左上角的 (0,0) 定位到图像的左上角你的 html 元素。

-ve left offset 表示您将图像向左移动，-ve top offset 表示将图像向上移动..

在上面的代码中，第一个 0 指的是 left offset，第二个 0 指的是 top offset..

{background-position: -209px -2px}

表示您将图像向左移动 209 像素，向上移动 2 像素。

希望对您有所帮助。