html-iframe_HTML iframe

html-iframe

iframe (Iframes)

In HTML, iframes are used to display a webpage inside another webpage.

在HTML中, iframe用于在另一个网页内显示一个网页。

Syntax:

句法:

<iframe src="URL"></iframe>

The <iframe> tag is used to define an iframe. And the src attribute is used to specify the location (URL) of the webpage that is to be included.

<iframe>标记用于定义iframe。 src属性用于指定要包含的网页的位置(URL)。

iframe广告代码属性 (Iframe Tag properties)

Some of the common properties of the iframe are,

iframe的一些常见属性是

i) height and width properties

i)高度和宽度属性

The size of the iframe is defined in HTML using height and width properties.

iframe的大小是使用HTML的height和width属性定义的。

Method 1: In HTML using height and width attribute, the default unit to define the values in pixels.

方法1:在使用height和width属性HTML中,默认单位以像素为单位定义值。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Iframes in HTML </h1>
<p>Example to define height and width in iframe</p>
<iframe src="https://www.includehelp.com/" width="500" heigth="200"></iframe>
</body>
</html>

Output

输出量

HTML iframe example 1

Method 2: In CSS using height and width of iframe.

方法2:在CSS中使用iframe的高度和宽度。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Iframes in HTML </h1>
<p>Example to define height and width in iframe</p>
<iframe src="https://www.includehelp.com/" style="height:400px; width:500px"></iframe>
</body>
</html>

Output

输出量

HTML iframe example 2

ii) Iframe borders (The border property)

ii)iframe边框(border属性)

In iFrames, there is a default border around it. You can define the border for the iframe in HTML using CSS border property.

在iFrame中,它周围有一个默认边框。 您可以使用CSS border属性为HTML中的iframe定义边框。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Iframes in HTML </h1>
<p>Example to define height and width in iframe</p>
<iframe src="https://www.includehelp.com/" style="border: 2px dotted green"></iframe>
</body>
</html>

Output

输出量

HTML iframe example 3
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Iframes in HTML </h1>
<p>Example to define height and width in iframe</p>
<iframe src="https://www.includehelp.com/" style="border: none;"></iframe>
</body>
</html>

Output

输出量

HTML iframe example 4

iii) Changing link in iframe

iii)在iframe中更改链接

In the iframe, the link can be changed for the iframe to the next link in an event. The attribute target and name are required.

在iframe中,可以将iframe的链接更改为事件中的下一个链接。 属性目标和名称是必需的。

The name attribute defines the name iframe whose link is to be redefined.

name属性定义要重新定义其链接的名称iframe。

The target attribute is defined in another tag with the same value as the name of the iframe and will be used to replace the src of the iframe.

target属性是在另一个标签中定义的,该标签的值与iframe的名称相同,并将用于替换iframe的src 。

<html>
<head>
</head>
<body>
<h1>Iframes in HTML </h1>
<p>Example to replace link in iframe</p>
<iframe src="https://www.includehelp.com/" name="iframe1" width="500" height="450"></iframe>
<br>
<a href="https://www.includehelp.com/scala/" target="iframe1">Lets see my new article</a>
</body>
</html>

Output

输出量

HTML iframe example 5


After cliking on the link...

点击链接后...



HTML iframe example 6

翻译自: https://www.includehelp.com/html/iframes.aspx

html-iframe

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/543709.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

集合操作(三)Set

2019独角兽企业重金招聘Python工程师标准>>> Set集合 HashSet 哈希表保证元素的唯一性依赖于两个方法一个是hashCode方法一个是equals方法 如果两个对象的hashCode值相同,并且调用该对象的equals方法返回的是true的时候,那么就说明两个对象是相同的 结论&#xff1a…

第6周 搜索与排序

1 查找里程 给你这样一张里程表&#xff0c;如何写一个程序&#xff0c;输入两地的地名&#xff0c;能输出期间的里程&#xff1f; #include <stdio.h> #include <string.h> #define C_LEN 30typedef struct city {char name1[C_LEN];char name2[C_LEN];int distan…

(转) Twisted :第十九部分 改变之前的想法

2019独角兽企业重金招聘Python工程师标准>>> 简介 Twisted是一个正在进展的项目,它的开发者会定期添加新的特性并且扩展旧的特性. 随着Twisted 10.1.0发布,开发者向 Deferred 类添加了一个新的特性—— cancellation ——这正是我们今天要研究的. 异步编程将请求和响…

Mac 获取 Brew

2019独角兽企业重金招聘Python工程师标准>>> 终端输入 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" 转载于:https://my.oschina.net/fdstudio/blog/610680

express 项目生成器_用于项目的Express模板生成器(2)| 应用程序结构研究

express 项目生成器Hello! In express template generator for your projects (1), we looked at express generator and how we can start an express application with stressing to build a brand new structure of all required files. 你好&#xff01; 在针对您的项目的E…

Linux 服务器中文乱码编码解决

Linux环境的ECS中&#xff0c;若出现如下中文显示为乱码的情况。 一般原因如下: 1. 未安装中文语言包 2. 未设置正确的默认语言 3. SSH 终端未正确配置 本文以Centos 6.5为例&#xff0c;演示如何解决中文乱码问题。 1. 使用 locale -a |grep zh_CN查看系统是否已经安装…

ldo regula_使用C中的Regula Falsi方法找到复多项式方程的根

ldo regulaRegula Falsi方法 (Regula Falsi method) About the method: 关于方法&#xff1a; We often hear many children and even many adults complaining about the difficulty level that they face while solving complex polynomial equations. It is also difficult…

go newscanner判断文件读取结束_Go单元测试-testing

在开发程序中&#xff0c;很重要一点就是测试&#xff0c;测试可以保证代码的质量&#xff0c;保证每个函数可以正常运行。但是如何保证写出来的程序是否正确。单元测试一般是用来测试我们的代码逻辑有没有问题&#xff0c;有没有按照我们期望的运行&#xff0c;以保证代码质量…

nextdate函数白盒测试问题 软件测试_软件测试基本常识

一、软件测试的分类&#xff1a;1.按照是否执行被测试软件来分&#xff1a;静态测试&#xff1a;是指不运行软件&#xff0c;测试包括代码检查、静态结构分析、代码质量度量等&#xff0c;主要对软件需求说明书、设计说明书、软件源代码进行检查与分析。 动态测试&#xff1a;…

ideatomcat老是运行以前的项目_日“吞”150吨垃圾,禅城集中式餐厨垃圾处理项目启用...

12月9日&#xff0c;禅城区集中式餐厨垃圾处理项目正式投料试运行&#xff0c;该项目如今每天可处理150吨垃圾。这意味着禅城区将通过先进技术实现餐厨垃圾资源化、减量化、无害化处理。禅城区集中式餐厨垃圾处理项目位于佛山市南庄污水处理厂首期工程北侧&#xff0c;禅港路西…

java怎么知道上传文件是否成功_文件包含漏洞之——tomcat CVE-2020-1938漏洞复现

这个漏洞是今年2月份出现的&#xff0c;他的影响范围也是非常广的。2月20日&#xff0c;国家信息安全漏洞共享平台&#xff08;CNVD&#xff09;发布了Apache Tomcat文件包含漏洞&#xff08;CNVD-2020-10487/CVE-2020-1938&#xff09;&#xff0c;这个漏洞是由于Tomcat AJP协…

css word-wrap_CSS中分词“ break-all”和“ break-word”的值之间的差异

css word-wrapDefinition: 定义&#xff1a; What is the most fundamental element that comes to mind when you are considering to develop a web page? Words! If that was your answer, then pat yourself because you are already aware of what we are going to disc…

Android Studio apk 打包流程

1.Build -> Generate Signed APK...&#xff0c;打开如下窗口 2.假设这里没有打过apk包&#xff0c;点击Create new&#xff0c;窗口如下 这里只要输入几个必要项 Key store path&#xff08;生产key文件的保存路径 &#xff09; Key store password&#xff08;key 存储密码…

【Android】11.3 屏幕旋转和场景变换过程中GridView的呈现

分类&#xff1a;C#、Android、VS2015&#xff1b; 创建日期&#xff1a;2016-02-21 一、简介 实际上&#xff0c;对于布局文件中的View来说&#xff0c;大多数情况下&#xff0c;Android都会自动保存这些状态&#xff0c;并不需要我们都去处理它。这一节仍以GridView为例&…

html---textarea初始化时就有个table空格以及tab键操作无效

1 初始化时就有一个tab空格这是由于<textarea></textarea>之间的内容不为空的原因&#xff0c;包含空格和换行&#xff0c;否则浏览器会觉得空格或者换行都是文本域的内容。因此书写时需将<textarea></textarea>紧靠在一起。2 tab键对textarea操作无效…

android decorView详解

摘要 一、DecorView为整个Window界面的最顶层View。 二、DecorView只有一个子元素为LinearLayout。代表整个Window界面&#xff0c;包含通知栏&#xff0c;标题栏&#xff0c;内容显示栏三块区域。 三、LinearLayout里有两个FrameLayout子元素。 (20)为标题栏显示界面。只有一个…

3dmax批量导入obj_ArcGIS 与 3DMax 结合建模

整体技术思路是将项目区二维的CAD测绘底图&#xff0c;通过整理导入到3DMax中&#xff0c;根据CAD底图为基础&#xff0c;绘制三维数字模型。利用Photoshop 平面图像处理软件&#xff0c;对现场采集的照片进行修整&#xff0c;为三维模型制作表面贴图。最终把贴好材质的三维楼体…

字符串乘一个数_【思维拓展】三位数乘两位数,构造最大积和最小积

前面袁老师给大家讲了一个重要结论&#xff0c;并运用这个结论来解决问题&#xff0c;构造两位数乘两位数最大积和最小积的问题。今天&#xff0c;更进一步&#xff0c;三位数乘两位数中&#xff0c;如何构造最大积和最小的积&#xff1f;【问题引入】用9、8、6、5、4这五个数字…

ios 微信支付

服务器签名版本 官方已经是建议使用服务器签名来接入微信支付&#xff0c;实际上从安全上考虑&#xff0c;确实是每个客户端不应该知道RAS密钥&#xff0c;也不需要每个客户端都写一遍签名的算法。 服务端接入流程文档&#xff1a;https://pay.weixin.qq.com/wiki/doc/api/app.…

macos可以升级到指定版本吗_承装承修承试可以跨级升级吗?

在建筑行业&#xff0c;通常我们所说的承装承修承试&#xff0c;也就是指承装(修、试)电力设施许可证。承装(修、试)电力设施许可证的功能作用相当于建筑资质&#xff0c;企业需要办理许可证后才能承接电力设施的安装、维护、调试等工程项目。承装(修、试)电力设施许可证可以办…