Internet explorer iframe缩放问题

我试图让一个跨浏览器的css缩放工作，但我在这里找到的一切都不适合我

以下是我所拥有的：

HTML

<div id="themeframe">
<div class="themeframe-overlay"></div>
<iframe src="/index.php"></iframe>
</div>

我想要实现什么？ 我有一个520 x 400的div，我想用50%的网页缩放版本填充。如上所示，我在IE中遇到了一些问题，其中div/iframe的大小是正确的，但是里面的网页是100%，而不是50%。这在其他浏览器中都有效。如果添加缩放：0.5；对于iframe css，它在IE中修复了它，但在chrome中破坏了它

我很难在IE、Chrome、Safari和Firefox中同时使用它

---

有什么想法吗？

找到了答案，至少对我有用。部分答案是按照以下步骤使用的

首先，像这样排列你的HTML（我不擅长在这个网站上排列代码）：

我要指出的变化是：

我将

iframe

包装在一个名为

themeframe

我给了

iframe

一个

id

，这样我们就可以用CSS来设计它了

我在

的包装div上使用了
-ms zoom
，而不是在
iframe
中。这是因为IE会将整个iframe缩放到您设置的
zoom
大小，而不是其中的内容（这是Chrome和Firefox所做的）。同样重要的是在CSS中使用
-ms zoom
，而不是简单的
zoom
，因为如果不区分
ms
的话，Chrome会发疯并同时关注
zoom
和
-webkit

---

希望这有帮助。它在Chrome、FF和IE8中对我有效。

找到了答案，至少对我有效。部分答案是按照以下步骤使用的

首先，像这样排列你的HTML（我不擅长在这个网站上排列代码）：

我要指出的变化是：

我将

iframe

包装在一个名为

themeframe

我给了

iframe

一个

id

，这样我们就可以用CSS来设计它了

我在

的包装div上使用了
-ms zoom
，而不是在
iframe
中。这是因为IE会将整个iframe缩放到您设置的
zoom
大小，而不是其中的内容（这是Chrome和Firefox所做的）。同样重要的是在CSS中使用
-ms zoom
，而不是简单的
zoom
，因为如果不区分
ms
的话，Chrome会发疯并同时关注
zoom
和
-webkit

希望这有帮助。它适用于我的Chrome、FF和IE8

#themeframe{
position:relative;
width:520px;
height:400px;
margin-top: 20px;
border: none;
overflow: hidden;
}

#themeframe .themeframe-overlay{
position:absolute;
z-index:95;
left:0;top:0;
height:100%;width:100%;
background:#fff;
opacity:0;
filter: alpha(opacity = 0);
}


#themeframe iframe {
width:1040px;
min-height: 800px;
overflow: hidden;
-moz-transform: scale(0.5);
-moz-transform-origin: 0 0;
-o-transform: scale(0.5);
-o-transform-origin: 0 0;
-webkit-transform: scale(0.5);
-webkit-transform-origin: 0 0;
-ms-transform: scale(0.5);
-ms-transform-origin: 0 0;
margin: 0;
padding:0;
border: none;
}

<div id="themeframe">
    <iframe src="/index.php" id="frame" width="794" height="1550"></iframe >
</div>

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


#frame {
    position: absolute;
    overflow-x: hidden;
    top: -300px;
    -moz-transform: scale(0.75);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.75);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.75);
    -webkit-transform-origin: 0 0;