挑战：使背景和两个div元素相对于浏览器窗口缩放和移动

Question

我想采取这里的内容：

http://test.thebkk.net

并使其缩放并适合任何浏览器窗口，保持元素的位置并将图像完全保留在窗口中。

涉及定位等的CSS：

body {
       background-color: black;
       background-image: url('http://thebkk.net/Images/BVF-Temp.jpg');
       background-repeat: no-repeat;
       background-position: 45px -30px;
}

/* Player Style */
#player {
      position: fixed;
      width: 680px;
      margin-top: 15px;
      margin-left: 350px;
      border: outset 5px white;
}
ul#menu {
      position: fixed;
      margin-top: 12px; 
      margin-left: 90px;
      padding: 0; 
      list-style: none;
      clear: both;     
}  

Answer 1

使用background-size: 100% auto;（w / h）并认为应该有用。其他一切使用百分比宽度（和高度）和位置