Iframe嵌入页面大小边框和调整

墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 4.5k累计阅读 4.5k平均单平台已同步平台 CSDN 微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网我也要 → 码龄7年

关注

原创最新推荐文章于 2026-08-13 10:22:44 发布 4.5k 阅读 AI 写同款· GEO 优化 ›

前端必知必会-html的id属性和Iframe 本文介绍了的html的id属性和iframe使用，如有问题欢迎私信和评论。阅读详情

Iframe嵌入页面大小边框和调整

调整后面页大小

在这里插入图片描述

原始页未调整
在这里插入图片描述
代码：jsp

	<!-- 交易一览 -->
	<div class="jjyl twodw" style="width: 90%;height: 650px;display:none;">
		<iframe id="main" name="main" class="twodw"  frameborder="0" scrolling="no"
		 src="http://175.6.xxx.xxxx:xxxx/bs/#/home"></iframe>
	</div>

css 主要用到属性: transform

scale比例

width 宽度调解

#main {
    position: absolute;
    transform: scale(.7, .7) translate(-50%, -50%);  //主要控制嵌入页面边框
    width: 1700px;
    height: 900px;
    top: 240px;
    left: 360px;
}

当css transform值为一下值时。效果

#main {
    position: absolute;
    transform: scale(.7, .7) translate(-50%, -50%);  //主要控制嵌入页面边框
    width: ***1900px;***
    height: 900px;
    top: 240px;
    left: 360px;
}

在这里插入图片描述

收录于

jsp

当前文章被收录于：

jsp

1 篇文章 0 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

标签

#javascript #css #html

调整 iframe 的大小以适应其内容代码】调整iframe的大小以适应其内容。阅读详情

相关推荐

ctfshow 萌新22 （类似级客巅峰web4）

在之前ctfshow平台的萌新22，大家都认为是无解的，题目也介绍了"还能搞，阿呆表示将直播倒立放水"。但是在级客巅峰结束的那天晚上，群里的师傅介绍说，如果修改了php.ini里面的配置(register_argc_argv)可以做出来。最后是真的做出来了。使用阿呆~~~？下面是自己的思考，感谢Guoke师傅和ha1c9on师傅的帮助一. 源代码 <?php if(isset($_GET['c'])){ $c=$_GET['c']; if(!preg_mat.

Firebasky的博客 4209

嵌入网页，调整内容的大小

当我们需要在自己的网页里嵌入别人网页内容的时候可以用HTML的iframe标签来做到，iframe标签的定义为：iframe 元素会创建包含另外一个文档的内联框架（即行内框架），基本上所有的浏览器都支持。附上w3school的介绍链接： http://www.w3school.com.cn/tags/tag_iframe.asp 下面是iframe标签的属性：我用到的是：frameb

雨果的博客 1万+

DeepSeek-V4-Pro 正式版突袭上线：Agent 能力暴涨，DeepSWE 直接干翻 Claude Opus 4.8

8 月 12 日深夜，DeepSeek 悄悄在 API 文档里上架了一个新版本号——DeepSeek-V4-Pro-0813。第二天（13 日），这个版本被确认为 V4 Pro 正式版。没有发布会，没有预热，只改了版本号，就把整个 AI 圈的注意力又抢了过去。

2601_96613114的博客 831

iframe嵌入网页时，页面大小怎么自适应

问题描述：页面中有一容器div，有宽高属性。在div中嵌入一个iframe页面，呈现这种效果：可以看到嵌入的页面只露出了一部分。而我们希望：嵌入的页面能够完全展示在容器中。思路：利用CSS的 transform，进行页面缩放。 1、我开发用的电脑屏幕分辨率是 1920 x 1080，以此为基准，设置iframe的宽高。 2、iframe 的父元素 div 的宽高是屏幕宽高的50%，所以 transform: scale(0.5)这个数值是0.5。（其余的三个属性没啥可说的，不明白的搜一下W3C吧

五花漏的博客 3万+

国土变更调查中六类拓扑错误的成因分析与高效修复实践

本文深入分析了国土变更调查中六类拓扑错误的成因，包括边界不一致和不规则图形等常见问题，并提出了高效的自动化修复实践。通过智能咬合算法、引力-斥力平衡模型等核心技术，显著提升了修复效率，节省人工质检时间70%。文章还分享了实战中的避坑指南和黄金法则，为相关从业人员提供了宝贵经验。

weixin_29202213的博客 355

AutoDL跑yolo

由于博主在AutoDL的JupyterLab的终端直接上传ZIp文件要么老是再上传中被中断，要么就是上传后使用unzip指令解压显示“找不到”，作为纯小白的我实在太难了！这个文件列出了一个 Python 项目所需的所有依赖包及其精确的版本号。这个文件是 Python 项目中常见的一种方式，用于确保项目在不同环境中都能以相同的依赖包配置运行。3.进入JupyterLab，在文件夹目录中找到上传的文件夹，右键点击“复制路径”。然后在终端中输入以下指令进行切换到该文件夹路径。9.安装成功后开始输入指令开跑！

m0_73804659的博客 1198

iframe中内嵌div的width为100%出现的不兼容现象

今天发现，一个内嵌在iframe中的div，当样式宽度设置为width=100%时，出现ff和ie不兼容的情况。 ff中这个div宽度超过iframe的宽度而ie中这个div宽度不足iframe的宽度经过百度，发现是因为不同浏览器中width=100%有不同的定义。 ff中width=100%是整个iframe的外部宽度，也就是iframe宽度为多少，div宽度也是多少

a_c_c_a的专栏 4060

CDD数据库文件制作（十一）——服务配置（0x19_DTC Code）

虽然选择Copy和Reference都可以加载DTC，但是如果我们在DTC库中有修改DTC，通过Copy的方式加载的DTC在DTC Table中不会跟着DTC库的修改而自动更新。通过Reference的方式加载的DTC可以自动更新。找到Fault Memory的DTC Table，鼠标放在DTC Table区域，右键点击选择Copy …根据需要(客户协议)勾选响应的19服务子功能。如何创建一个新的DTC code？按照字母与下方要素可做一一对应。首先在DTC库中新建DTC。支持10 01/10 03。

LOVE135149的博客 1905

html嵌入html页面方法,Flex组件IFrame中嵌入HTML页面的方法

具体的一个例子——使用IFrame这个框架的一个页面的代码如下：body { margin: 0px; overflow:hidden }classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#v...

weixin_39886929的博客 162

OCR文字识别领域经典论文总结

本篇将介绍文字识别经典论文，内容包括文字检测、文字识别、端到端识别等方法，具体将分别对论文算法简介、思路、代码等几个部分展开介绍。目前各部分只举例经典论文，算法没有全部写完，后续会将在此部分基础上更新更多论文综述及代码实战部分。.................................

专注大数据与人工智能技术分享，欢迎私信加群互相学习！ 1万+

数据库课程案例——电力公司收费管理系统分析与实践，完整带SQL语句

某电力公司收费管理信息系统实现客户信息、用电类型(类别号、类别名、电价)及业务员管理；实现客户用电信息管理(客户号、月份、用电类别号、用电度数)；实现客户费用管理(客户号、月份、费用、收费标志)，收费标志的默认值为“未收”；实现收费登记(客户、月份、应收费用、实收费用、业务员)，并自动修改收费标志(用触发器实现)；创建触发器,实现收费时自动更加应收费用和实收费用，计算本次结余,然后修改客户信息表中的结余金额；创建存储过程统计指定月份应收费用和实收费用；创建存储过程查询指定月份未交费的用户信息，以便崔费;创建

qq_44242804的博客 2757

HTML（六）——HTML表单和框架

HTML 表单用于收集用户的输入信息，是一个包含表单元素的区域HTML 表单表示文档中的一个区域，此区域包含交互控件，将用户收集到的信息发送到 Web 服务器。HTML 表单通常包含各种输入字段、复选框、单选按钮、下拉列表等元素。<form>元素用于创建表单，action属性定义了表单数据提交的目标 URL，method属性定义了提交数据的 HTTP 方法（这里使用的是 "post"）。<label>元素用于为表单元素添加标签，提高可访问性。<input>

m0_62701594的博客 1457

热红外图像小目标检测算法综述

热红外小目标检测算法综述，着重介绍基于深度学习的小目标检测算法

Littro Innovations 4229

编写网页时如何添加外部网页

内联框架，用于向当前页面中引入一个其他页面 src指定要引入网页的路径 frameborder指定内联框架的边框 iframeborder(内联框架) <iframe src=“https://www.qq.com” width=“800” height=“600” frameborder=“0”></iframe> 这里引用了腾讯的网页，也可以调整这个网页的长与宽，和图片一样用width 和 height 而最后的零表示我们所编写的网页是否有框架，如果改写成1...

m0_67176957的博客 709

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android：LinePhone3.2.7(最新版本)，官网地址：http://www.linphone.org/

ET2012新版免狗免安装绿色软件

ET2012新版免狗免安祖昂绿色软件。，新界面，新视觉，

12.内联框架.html

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <!--

weixin_47952737的博客 96

复分析阿尔福斯(Ahlfors) 第三版答案英文

答案分为十章，有部分习题没有答案，全英文复分析阿尔福斯(Ahlfors) 第三版答案

010-内联框架

内联框架 Hello

qq_36150351的博客 96

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件，这是C++版本的破解文件

iframe笔记

1.iframe的属性例子： iframe一般用在页面中嵌入其他页面时候。常用属性值： name：内嵌帧名称　　width：内嵌帧宽度(可用像素值或百分比) marginwidth：帧内文本的左右页边距　　marginheight：帧内文本的上下页边距　　scrolling：是否出现滚动条(“auto”为自动，“yes”为显示，“

追梦少年 698

EasyUI中使用easyui-dialog加载iframe【推荐】

为了解决这个问题，尝试很多操作方式，发现都没能用iframe成功加载其他html页面，最终找到如下的实现方式，亲测可用~ 先来看看html代码 <div id="dlgVideo" class="easyui-dialog" style="width: 450px; height: 350px; padding: 10px 20px" closed="true" buttons="#dlg-video-buttons"> <iframe scrolling="auto"

pang9998的博客 956

frame,iframe,frameset之间的关系与区别

frame,iframe,frameset之间的关系与区别 iframe 是在html页面内嵌入框架框架内可以连接另一个页面，如 frameset 在一个页面中设置一个或多个框架不能嵌套在body标签里 frameset 它称为框架标记，是用来告知HTML文件是框架模式，并且设定可视窗口怎么分割 fra

zzjjiandan的专栏 962

iframe标签（页面嵌套）

开发工具与关键技术：VS <iframe> 作者:听民谣的老猫撰写时间：2019/6/10 18:15 上面两张图是两个不同的页面但是它们的基本框架都是一样，每点击一次左边的导航栏改变的都是中间的内容区域。也就是说共同的框架都是没有改变的，改变的是中间的内容。有没有什么方法可以不改变外面的基本框架只改变中间的内容??? 我们可以用页面嵌套方法来达到这一要求。页面嵌...

猫老爷 20万+

iframe简单使用、获取iframe 、获取iframe 元素值、iframe获取父页面的信息

标签规定一个内联框架。一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。注意：URL建议用绝对路径如果一个页面里面有框架，点页面里的连接，要求在这个里打开。在中规定name 然后在修改默认打开模式，：网页head中加上或部分连接的目标框架设为（**）要插入一个页面。要求只拿中间一部分。其他的都不要。代码：控制插入页被框架覆盖的深度控制框架覆盖上部分的深度 scrolling滚动条要否（auto、yes、no） frameborder框架的边框大小，width=776 height=2

m0_63348818的博客 4万+

iframe 嵌入页面

是框架的一种形式，也比较常用到。例子1。不用多说了。 width插入页的宽；height插入页的高；scrolling 是否显示页面滚动条（可选的参数为 auto、yes、no，如果省略这个参数，则默认为auto）；frameborder 边框大小；注意：URL建议用绝对路径传说中百DU用：黑了88*8。。。例子2。如果一个页

好记性不如烂笔头--玲博小记 3608

在一个页面嵌入另一个页面，而且还要调整比例大小如何做呢

在html里面嵌入另一个页面，用到框架集iframe ，而且还对它的边框设置为0 <div class="main-content-header"> <%-- 第一个水晶报表--%> <div class="main-content-up-left" id=rone > ...

火麒马 2629

iframe内容适应div大小_html如何嵌套页面？iframe标签告诉你答案

本篇文章主要为大家介绍了html iframe标签的介绍，让大家知道怎么通过iframe标签来为网页嵌套页面，内容很简单，大家照着这上面的来，多实践几次就懂了。希望大家都能好好学习，现在让我们来看这篇文章吧。在这里首先介绍的是HTML中iframe标签的用法：怎么在一个网页中嵌入另一个网页呢，我们可以用html中的iframe标签搞定。iframe支持所有浏览器。下面来看语法：>...

weixin_39777018的博客 1907

深入探究iframe：网页嵌入的魔法盒子（上）

iframe是一种HTML标签，用于在网页中嵌入另一个网页。iframe允许您在当前页面中嵌入另一个完全独立的网页，这两个网页之间可以进行交互，但它们具有独立的域名和会话。内容嵌入：iframe允许您将另一个网页嵌入到当前页面中，这可以用于在当前页面中显示广告、工具栏或其他内容。跨域交互：iframe允许您在两个不同的域名之间进行交互，这可以用于实现跨域登录、跨域数据传输等功能。页面缩放：iframe的方法可以用来调整嵌入的网页的大小。历史记录。