我刚测试过，对我来说，其他的解决方案都不奏效。 我只是简单地尝试了一下，它在Firefox和Chrome上运行得很好。

<div class='wrap'>
  <iframe ...></iframe>
</div>

还有css:

.wrap {
  width: 640px;
  height: 480px;
  overflow: hidden;
}

iframe {
  width: 76.92% !important;
  height: 76.92% !important;
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
}

这将所有内容放大23.08%，相当于原始版本比嵌入式版本大30%。(宽度/高度百分比当然需要相应调整(1/scale_factor))。

在花了几个小时试图让它在IE8、9和10中工作之后，下面是对我有效的方法。

这个精简的CSS工作在FF 26, Chrome 32, Opera 18，和IE9 -11 2014年1月7日:

.wrap
{
    width: 320px;
    height: 192px;
    padding: 0;
    overflow: hidden;
}

.frame
{
    width: 1280px;
    height: 786px;
    border: 0;

    -ms-transform: scale(0.25);
    -moz-transform: scale(0.25);
    -o-transform: scale(0.25);
    -webkit-transform: scale(0.25);
    transform: scale(0.25);

    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

对于IE8，设置宽度/高度以匹配iframe，并在.wrap container div中添加-ms-zoom:

.wrap
{
    width: 1280px; /* same size as frame */
    height: 768px;
    -ms-zoom: 0.25; /* for IE 8 ONLY */
}

只需使用您最喜欢的浏览器嗅探方法，有条件地包含适当的CSS，参见是否有一种方法在*.css文件中执行特定于浏览器的条件CSS ?为了一些想法。

IE7是一个失败的原因，因为-ms-zoom直到IE8才出现。

下面是我测试的实际HTML:

<div class="wrap">
   <iframe class="frame" src="http://time.is"></iframe>
</div>
<div class="wrap">
    <iframe class="frame" src="http://apple.com"></iframe>
</div>

http://jsfiddle.net/esassaman/PnWFY/

所以可能不是最好的解决方案，但似乎还可以。

<IFRAME ID=myframe SRC=.... ></IFRAME>

<SCRIPT>
    window.onload = function(){document.getElementById('myframe').contentWindow.document.body.style = 'zoom:50%;';};
</SCRIPT>

显然不是试图修复父元素，只是添加了“缩放:50%”样式到子元素的主体，并使用了一点javascript。

也许可以设置“HTML”元素的样式，但没有尝试。

对于那些在IE中遇到困难的人，可以使用下面建议的-ms-zoom，并在#wrap div上使用缩放功能，而不是iframe id。根据我的经验，使用缩放函数尝试缩放#frame的iframe div，它将缩放iframe的大小，而不是其中的内容(这是你想要的)。

就像这样。适用于我的IE8, Chrome和FF。

#wrap {
  overflow: hidden;
  position: relative;
  width:800px;
  height:850px;
  -ms-zoom: 0.75;
}

我刚测试过，对我来说，其他的解决方案都不奏效。 我只是简单地尝试了一下，它在Firefox和Chrome上运行得很好。

<div class='wrap'>
  <iframe ...></iframe>
</div>

还有css:

.wrap {
  width: 640px;
  height: 480px;
  overflow: hidden;
}

iframe {
  width: 76.92% !important;
  height: 76.92% !important;
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
}

这将所有内容放大23.08%，相当于原始版本比嵌入式版本大30%。(宽度/高度百分比当然需要相应调整(1/scale_factor))。

这是我在一个宽度为890px的页面上的解决方案

#frame { 
overflow: hidden;
position: relative;
width:1044px;
height:1600px;
-ms-zoom: 0.85;
-moz-transform: scale(0.85);
-moz-transform-origin: 0px 0;
-o-transform: scale(0.85);
-o-transform-origin: 0 0;
-webkit-transform: scale(0.85);
-webkit-transform-origin: 0 0; 

}