私はcss3pleaseが大好きです:
<style type="text/css">
.box_scale {
width:300px;
height:300px;
-webkit-transform: scale(0.5); /* Saf3.1+, Chrome */
-moz-transform: scale(0.5); /* FF3.5+ */
-ms-transform: scale(0.5); /* IE9 */
-o-transform: scale(0.5); /* Opera 10.5+ */
transform: scale(0.5);
filter: progid:DXImageTransform.Microsoft.Matrix(/* IE6–IE9 */
M11=0.9999619230641713, M12=-0.008726535498373935, M21=0.008726535498373935, M22=0.9999619230641713,SizingMethod='auto expand');
}
</style>
<div class="box_scale">
<iframe width="300" height="300" src="http://example.org"></iframe>
</div>
スケールを選択する以外の唯一のことは、div に幅と高さを追加することでした。もちろん、変換起点にもいくつかのルールを追加したい場合があります。参照: https://developer.mozilla.org/en/CSS/transform