如何呈现在较小的iframe一个完整的网页？(How to render a full webpag

我有一个自定义的内容管理系统。 我使用的CKEditor改变内容。 我想在网页的实时预览，当我点击编辑后提交按钮。 我使用的iframe，但它显示了水平和垂直滚动条，因为该网页的大小大。

我想这样做在一个特定的维度，即可查看完整的页面是指再现网页在一个更小的尺寸。 即使这是我没有任何问题网页的图像。

Answer 1:

我爱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

文章来源: How to render a full webpage in smaller iframe?