如何使用 CSS 将 Iframe 内容缩放至原始大小的 80%？

缩放 iframe 中的内容

要将 iframe 的内容缩放到所需的大小，您可以利用 CSS 转换。在本例中，目标是显示 iframe 的原始大小的 80%。

Kip 的解决方案，稍加修改，就可以在 Opera 和 Safari 等浏览器中实现这一目标。 CSS 应按如下方式调整：

#wrap { width: 600px; height: 390px; padding: 0; overflow: hidden; }
#frame { width: 800px; height: 520px; border: 1px solid black; }
#frame {
    -ms-zoom: 0.75;
    -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;
}

在此代码中，“-ms-zoom”属性特定于 Internet Explorer，而其他转换属性适用于其他浏览器。将“scale”值设置为 0.75 可以有效地将 iframe 内容缩小到其原始大小的 75%。

此外，您可能需要在“frame”元素上设置“overflow: hide”以抑制外观滚动条。这将确保缩放后的内容保持在指定的尺寸内。

以上是如何使用 CSS 将 Iframe 内容缩放至原始大小的 80%？的详细内容。更多信息请关注PHP中文网其他相关文章！