按比例放大整個div

Question

我想知道是否可以放大div的百分比及其內容？

遊戲我建立是基於像素的，所以我不能使用gameContainer（背景圖像也將需要擴展）

這裏是我想要達到一個演示中的百分比http://codepen.io/friendlygiraffe/pen/MKwjNE

<div id="gameContainer"> 
<div id="scene2"> 
     <div id="box1"></div> 
<div id="box2"></div>   
</div> 
</div> 

Answer 1

不確定哪款div需要scaling，但你可以在需要縮放項目的CSS使用transform: scale();屬性。

如：

#box2 { 
    top : 80px; 
     position: absolute; 
     background-position: center; 
    background-size: contain; 
    background-image: url("http://blog.codepen.io/wp-content/uploads/2012/08/main_logo.jpeg"); 
    width: 200px; 
    height: 100px; 
    transform: scale(2) 
} 

這在BOX2 DIV加倍的內容規模。然後相應地對新值進行響應。

例如： codepen