CSS图像定位

Question

假设我的图片宽度为2000像素。我的图像的时髦设计部分从大约600px开始，宽约900px。我想要做的是使用这个图像作为网站的背景，并使时髦的设计居中，当你拉伸浏览器窗口时，显示整个图像仍然保持时髦的设计居中。我怎样才能做到这一点？此外，将时髦的部分放在背景上方的自己的层中也不是一种选择。

谢谢

Answer 1

您可以使用CSS background-position属性居中背景图片：

background-position: top center;

Answer 2

要添加到Guffa的答案，您还可以使用百分比和像素值来定位背景图像：

/* Centered vertically, 200px down from the top of the page  */
background-position: 50% 200px;

/* 30px from the left edge, -10px from the top (shifted up beyond the top)  */
background-position: 30px -10px;