有没有办法将iframe中链接的网页完全缩放至iframe中。我做出来的是图一的效果，怎么实现图二的效果。

Posted 2023-04-17

图一
图二

参考技术A

参考技术B 把你iframe嵌套页面的高度设置成原来页面的宽度以及高度追问

这是不让页面滚动。

追答

把你iframe嵌套页面的高度设置成原来页面的宽度以及高度

追问

那不是我要的效果

追答

给你Iframe 内的页面中添加这一个样式
body

zoom:70%;

把当前页面缩放百分之七十，你自己调试你合适的比例就好了。

本回答被提问者采纳

如何缩放 iframe 中的内容以适合我的页面大小

【中文标题】如何缩放 iframe 中的内容以适合我的页面大小

【英文标题】：how to zoom content in iframe to fit my page size

【发布时间】：2016-08-12 05:29:03

【问题描述】：

我需要将此 iframe 放在我的页面中，我需要将其缩放（变小）

原始页面是http://palweather.ps/temps/days/forecast/120

我尝试了以下代码（我在链接后添加了#zoom=75，但它不起作用）

    <iframe border="0" frameborder="0"  name="map" src="http://palweather.ps/temps/days/forecast/120#zoom=75" style="width: 100%;" >Your browser does not support inline frames or is currently configured not to display inline frames.</iframe>

【问题讨论】：

How can I scale the content of an iframe?的可能重复

【参考方案1】：

在尝试让它在 IE8、9 和 10 中工作几个小时后效果很好，这对我有用。

//html

<div class="wrap">
    This version works on FF 26, Chrome 32, Opera 18, and IE 9-11. 
    <iframe class="frame" src="http://time.is"></iframe>
</div>
<div class="wrap">
    <iframe class="frame" src="http://www.knowledgecity.com/activities/BUS1058-008/BUS1058-008.html"></iframe>
</div>

//javascript

.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;

http://jsfiddle.net/AwokeKnowing/yy8yb/