前端学习 -- 内联框架iframe

最新推荐文章于 2023-10-10 21:07:51 发布
最新推荐文章于 2023-10-10 21:07:51 发布
阅读量203 收藏
点赞数
文章标签： 前端 ViewUI
原文链接：http://www.cnblogs.com/androidsuperman/p/6540224.html
版权

内联框架iframe

可以向一个页面中引入其他的外部页面

内联框架中的内容不会被搜索引擎所检索，所以开发中尽量不要使用内联框架

<iframe></iframe>

属性：

  1. src：外部页面的地址，可以使用相对路径
  2. width和height：可以设置框架的宽度和高度
  3. name：可以为内联框架指定一个名字，可以将该属性值设置为超链接的target属性的值，这样当点击超链接时，页面将会在相应的内联框架中打开

例子：

<html>
<head>
<meta charset="utf-8">
</head>
<body>

<iframe src="C:/Users/MSI1/Desktop/线程生命周期.png"></iframe>

<p>一些老的浏览器不支持 iframe。</p>
<p>如果得不到支持，iframe 是不可见的。</p>


</body>
</html>

显示效果：

 

转载于:https://www.cnblogs.com/androidsuperman/p/6540224.html

A08110123
关注
前端第一阶段学习-HTML
08-08
内联框架`<iframe>`允许我们在一个网页中嵌入另一个网页，常用于嵌入地图、视频或外部应用。 表单是用户与网页交互的重要工具，`<form>`标签定义表单，`<input>`用于创建输入字段。单选框`<input type="radio">`让...
什么是iframe，火爆的微前端解决方案方案，教你快速看懂使用
最新发布
m0_47483157的博客
08-28 1857
iframe（Inline Frame） 是一种 HTML 标签，它允许在一个网页内部嵌套加载另一个网页，从而实现在主页面中展示外部网页内容的功能。iframe 创建了一个独立的浏览上下文，拥有自己的文档对象模型（DOM）和执行环境，这意味着它不会与主页面共享JavaScript变量或CSS样式，提供了较好的隔离性。基本用法 直接在模板中使用 标签： 在Vue组件的模板部分，你可以直接插入标签，并设置src属性指向你想要嵌入的页面URL。 2.设置 src 属性： s
iframe框架标签（内嵌页面）的基本介绍
weixin_70424030的博客
07-27 1万+
iframe的作用以及使用
当被问到你使用过iframe吗？有哪些优点和缺点？
study_way的博客
10-10 547
之前做需求遇到过这样的场景，两个不同的平台，其中一个平台需要使用另一个平台的某个页面，在没有用微前端和独立封装组件库的时候。就想到了使用iframe，直接将另一个页面嵌入到需要的页面里面。2即使是不同源的也没问题。前端的iframe（内联框架）是一种HTML元素，它允许你在网页中嵌入另一个网页或文档。通过使用iframe，你可以在一个网页中显示来自不同源或同一源的内容，这对于嵌入地图、视频、广告或其他外部资源非常有用。
前端iframe标签介绍及使用
weixin_30952103的博客
09-13 2001
使用的场景： (1) 有重复的板块内容显示的时候 # 后端如果是模板渲染方式(得到页面是通过继承的形式)，可以换成iframe来请求直接获取子功能页面 iframe标签的作用： iframe标签可以实现html主页面嵌套html子页面，子页面可以是一个功能页面，在某些时候使用iframe非常的方便 # 所以如果是模板渲染方式的，前端就可以使用iframe标签节...
前端学习9：HTML内联框架
RainstormGod的博客
04-14 859
属性值默认单位是像素，但是也可以用百分比来设定（比如“60%”)。height和width属性用于规定iframe的高度和宽度。frameborder属性规定是否显示iframe周围的边框。iframe可作为链接的目标(target)。iframe用于在网页内显示网页。提示：URL是指向隔离页面的位置。
什么是内联框架（iframe）？.pdf
11-24
内联框架（iframe）是HTML语言的一个重要组成部分，它允许在一个网页中嵌入另一个网页的内容。这个特性在HTML5标准中得到了正式的认可和支持。当浏览器遇到一个iframe元素时，它会在当前页面中创建一个独立的浏览...
layui-iframe3.1.5.zip
11-30
在前端开发中，iframe（内联框架）是一种将外部HTML文档嵌入到当前文档中的方法，常用于展示多个网页内容于同一页面、加载第三方服务、或者保护主页面不受嵌入内容影响（如防止脚本注入）。layui结合iframe，可以...
kiosk-iframe-源码.rar
10-10
通过对"Kiosk-iframe-源码"的深入学习，开发者不仅可以掌握如何构建一个Kiosk模式的应用，还能了解到前端开发中的跨域通信、安全防护、性能优化等多个方面的重要知识，这对提升个人技能和解决实际问题有着极大的帮助...
前端开源库-youtube-player
08-30
它通过创建一个内联框架（iframe）来加载视频，并提供了JavaScript接口用于播放、暂停、停止视频以及获取视频状态等操作。这个API使得开发者可以自定义视频播放器的外观和交互，从而更好地融入到网站的设计中。 **...
iframe框架使用(完美版)
05-10
iframe使用 自适应高度 封装js
【HTML基础-3】iframe框架详解及应用案例—实现页面嵌套
热门推荐
m0_64378913的博客
03-26 1万+
目录1 iframe框架概述2 iframe常用属性2.1 name属性2.2 src属性2.3 width属性2.4 height属性2.5 frameboder属性2.6 其他3 应用案例4 归纳参考文章 1 iframe框架概述 作用：< iframe > 标签规定一个内联框架。一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。即在一个页面中引入另一个页面，实现页面之间的嵌套。可以把需要的文本放置在 < iframe > 和 < /iframe
a元素与iframe元素的使用
weixin_51339619的博客
12-06 890
a元素target属性与iframe元素
HTML5 iframe标签和a标签组合使用
m0_54000129的博客
09-18 933
HTML5 iframe标签和a标签组合使用。
day11学习 前端HTML网页基本结构、标签及超链接的使用、内联框架
cosumerD的博客
07-12 315
前端学习 html网页基本结构、标签及超链接的使用、内联框架
Web前端之iframe详解
qq_27009517的博客
07-14 2037
iframe基本内涵 通常我们使用iframe直接直接在页面嵌套iframe标签指定src就可以了。 <iframe src="demo_iframe_sandbox.htm"></iframe> 但是，有追求的我们，并不是想要这么low的iframe. 我们来看看在iframe中还可以设置些什么属性 iframe常用属性: 1.frameborder:是否显示边框，1(yes),0(no) 2.height:框架作为一个普通元素的高度，建议在使用css设置。 3
vue 给iframe设置src_vue 中引入iframe，动态设置其src,遇到的一些小问题总结
weixin_39702316的博客
02-11 4558
1.重置其样式，去掉外框以及滚动条等id="myIframe"ref="iframe_a":src="mySrc"width="100%"height="100%"frameborder="no"border="0"marginwidth="0"marginheight="0"scrolling="no"allowtransparency="yes"/>2.在mounted里也找不到ifra...
前端学习（HTML）--内联框架
weixin_55904436的博客
12-04 249
本人学习笔记勿扰
《前端》HTML内联框架iframe
BelleDiao的博客
03-01 646
HTML中内联框架主要用于在网页中实现另一个网页的显示，相当于在网页中嵌套了另一个网页。 Iframe内联框架的src属性用于网页连接的设置，src指向哪个链接，网页上就显示哪个网页。 语法： <iframe src="URL"></iframe> 或直接设置宽高： <iframe src="demo_iframe.htm" width="2...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值