background-position - CSS min-height 与背景位置作斗争

Question

对于有问题的行为，请尝试调整此 Web 应用程序的窗口大小。认为标题和框在最小尺寸后停止调整大小，背景图像继续将自己定位在页面的中心，这看起来真的很愚蠢。

下面是背景图片的相关代码：

body{
  text-align: center;
  min-width:1000px;
  min-height: 600px;
  background: url(../images/road_newtry_tile4.jpg) 50% 50% fixed;   
}

即使 background-position 没有消除最小宽度和高度（即，窗口将在预定尺寸后停止调整大小，但它继续将背景图像居中。

为什么要这样做？如何防止图像在某个特定点后重新居中？

Answer 1

它这样做是因为 50% 是相对于浏览器窗口的大小而言的。解决方法是在包装 div 上设置背景图像，该 div 设置了最小宽度和最小高度。