ズームする方法内側のdivでない外側のdiv

Question

-moz-transform: scale(3.2)を使用してズームするとdivが表示されますが、そのdiv内のコンテンツ（他のdivc）ではなく、外側のdivのみズームしたいだけです。

はここしかしdiv2もズームする、私はdiv1をズームここに私のコード

<div id="div1" style="-moz-transform: scale(3.2);" > 
    <div id="div2"> 
     content 
    </div> 
</div> 

です。私はdiv1をズームしたいだけですが、div2の内容はそのまま表示されていることを意味するdiv2ではありません。

Answer 1

-moz-transform: scale(0.3125)を追加して親スケールをオフセットできます。基本的に0.3125 = 1/3.2ここで、3.2は親に適用されるスケール係数です。

<div id="div1" style="-moz-transform: scale(3.2);-webkit-transform: scale(3.2); transform: scale(3.2);" > 
 
     <div id="div2" style="-moz-transform: scale(.3125);-webkit-transform: scale(.3125); transform: scale(.3125);"> 
 
      content 
 
      </div> 
 
    </div>

Answer 2

CSS scaleを逆にすることができます。 transform: scale(0.25);：あなたは子供の規模1/4必要がある親にtransform: scale(4);を持っている場合は、あなたの場合は

div { 
 
    width: 50px; 
 
    height: 50px; 
 
} 
 
#div1 { 
 
    transform: scale(4); 
 
    border: 1px solid red; 
 
    margin: 100px; 
 
} 
 
#div2 { 
 
    transform: scale(0.25); 
 
    border: 1px solid green; 
 
}

<div id="div1"> 
 
    <div id="div2"> 
 
    content 
 
    </div> 
 
</div>

を、あなたはtransform: scale(0.3125);、3.2の逆数を必要としています。