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

输出量

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

html-iframe_HTML iframe相关推荐

  1. Selenium2+python自动化24-js处理富文本(带iframe)

    前言 上一篇Selenium2+python自动化23-富文本(自动发帖)解决了富文本上iframe问题,其实没什么特别之处,主要是iframe的切换,本篇讲解通过js的方法处理富文本上iframe的 ...

  2. FRAME与IFRAME

    FRAME与IFRAME 框架概念 : 所谓框架便是网页画面分成几个框窗,同时取得多个 URL.只需要 转载于:https://www.cnblogs.com/vibratea/archive/200 ...

  3. 用原生js的postMessage实现iframe传值,也可以用于跨域嵌套iframe传值

    Window postMessage() 方法 定义和用法 postMessage() 方法用于安全地实现跨源通信. 语法 otherWindow.postMessage(message, targe ...

  4. iframe几种常用代码片段

    <iframeid="SGframe"src="外部文件名.html"frameborder="no"scrolling=" ...

  5. ASP.NET小收集:IFrame使用

    使用Iframe制作一个固定框架,很方便与象后台网站之类的页面 1<htmlxmlns="http://www.w3.org/1999/xhtml">2<head ...

  6. iframe自动调整高度能在IE5里实现吗

    偶已经理解到style="height:expression(main.document.body.scrollHeight)"只对第一次显示的内嵌网页有效,如果里面的内容更新必须 ...

  7. 如何实现iframe(嵌入式帧)的自适应高度

    好几次看到有人提问问到如何实现 iframe 的自适应高度,能够随着页面的长度自动的适应以免除页面和 iframe 同时出现滚动条的现象,刚好我在工作中也碰到了类似问题,于是上网翻查,东抄抄西看看,弄 ...

  8. “画中画”效果--谈IFRAME标签的使用

    作者:秋实    文章来源:天极网页陶吧 纵观时下网站,本来网速就有些慢,可是几乎每页都要放什么Banner,栏目图片,版权等一大堆雷同的东西,当然,出于网站风格统一.广告效应的需要,本无可厚非,可毕 ...

  9. Iframe 用法浅析

    解释成"浏览器中的浏览器"很是恰当 <iframe frameborder=0 width=170 height=100 marginheight=0 marginwidth ...

  10. ajax iframe实现文件上传,iframe实现Ajax文件上传效果示例

    avascript部分 ajax 文件上传~~ window.οnlοad=function(){ var form=document.getElementsByTagName('form')[0]; ...

最新文章

  1. 视频动作识别--Temporal Segment Networks: Towards Good Practices for Deep Action Recognition
  2. Javascript获取当月的天数
  3. PHP严重致命错误处理:php Fatal error: Cannot redeclare clas
  4. SQL syntax-log2
  5. openresty开发系列20--lua的时间操作
  6. javascript注意点(1)
  7. Quartz.Net进阶之二:关于触发器的更多信息
  8. %3cphp和%3c php_PHP 编码安全
  9. TensorFlow 教程 --教程--2.10偏微分方程
  10. Qt 读写 txt 文件
  11. sap的pod确认_VLPOD确认交付凭证
  12. pytorch GPU版安装 与N卡显卡驱动升级 踩坑
  13. java能否构成三角形_java中判断三个参数是否能构成三角形的方法
  14. Android手机导出的已安装的APK到电脑
  15. 文档在线查看功能的实现
  16. UE4 自定义按键事件(踩坑记录)
  17. 科林明伦杯哈尔滨理工大学第六届程序设计团队赛-Team模拟
  18. 巡逻机器人(BFS)
  19. 爬取微信公众号详情页
  20. 解决导出Excel报COM类工厂错误的办法--修改版

热门文章

  1. pythonsql注入_python使用mysql,sql注入问题
  2. PHP无法执行MySQL语句,解决PHP执行批量MySQL语句的问题
  3. Angular性能优化之脏检测
  4. 2018百度之星程序设计大赛 - 资格赛 1002 子串查询
  5. TYVJ P1030 乳草的入侵 Label:跳马问题
  6. [DIV/CSS] 【译】60个有用CSS代码片段
  7. unity, undo
  8. zabbix企业应用之low level discovery监控mysql
  9. android点滴27:R文件无法加载 R cannot be resolved to a v...
  10. javascript变量声明语法的应用和分号讲究适用性