css - 保持超大背景图像居中

Question

我正在构建一个由 4 个 div 构成的单页网站，一个在另一个之上，每个都有自己固定的背景图像。图像比屏幕宽得多，因为我想在大范围的屏幕尺寸上保持其外观，但是有谁知道如何真正居中背景图像。因此，在小型显示器中，他们会看到图像的中心，而在较大的显示器中，他们会看到图像的相同位置，只是周围有更多内容。就像这个网站有

http://www.cantilever-chippy.co.uk/

当调整窗口大小时，背景图像会相应移动。

非常感谢。

Answer 1

如果您检查链接中的 css，您会看到解决方案:

#images #bg_1 {
  background-image: url(images/bg/1.jpg);
  background-position: 50% 0;
}

和 div:

<div class="bg_block" id="bg_1" style="height: 1200px; width: 1055px;"></div>

通过 JavaScript，他们会在每次调整大小时更改#bg_1 的宽度。

window.onresize = function(event) {
    $("#bg_1").css("width", $(window).width());
}