将网页大小调整为 div答案

【问题标题】：Resize web page into a div将网页大小调整为 div
【发布时间】：2026-02-09 04:35:01
【问题描述】：

在我的项目中，我使用此功能将外部网页加载到具有小尺寸 (250x295) 的 div 中：

 <div> 
<object type="text/html" data="http://www.example.com" width="250px" height="295px" style="overflow:auto;border:5px ridge blue">
</object></div>

问题是在 div 中我只看到页面的 250x295 部分，需要滚动查看所有数据。是否可以调整与 div 维度相关的整个页面的大小？（如“预览”）

提前致谢

【问题讨论】：

也许使用一些缩略图 API？即页面截图。
可能对你有帮助，*.com/questions/11382473/…
@LouisXIV：thumbnails api 用于调整图像大小并仍然保留图片质量，这里是网页而不是图像，所以它不会工作

标签： javascript jquery html css

【解决方案1】：

您可以尝试使用 CSS3 2d 变换的scale() 方法：

div {
    -moz-transform: scale(0.4);
    -o-transform: scale(0.4);
    -webkit-transform: scale(0.4);
    transform: scale(0.4);
}

【讨论】：

好电话，这也是我的第一个想法。

【解决方案2】：

您以这种方式排列 div 使其看起来像预览，希望它会有所帮助。

<div style="border:5px ridge blue;display:inline-block;width:250px; height:295px;">
<div style="overflow:hidden;height:inherit; " >     

<object type="text/html" data="http://www.example.com"  
style="overflow:hidden;  height:inherit; position:relative; width:inherit;">    
</object> 

</div>
</div>

Demo

【讨论】：