1 <iframe src="URL">iframe>iframe语法-->

 该URL指向不同的网页,将窗口内容显示为URL地址指向页面。

Iframe - 设置高度与宽度:height和width属性用来定义iframe标签的高度与宽度;属性默认以像素为单位, 但是你可以指定其按比例显示 (如："80%").需要注意的是 一些旧的浏览器不支持 iframe,如果浏览器不支持 iframes 则不会显示。

1 <iframe src=https://www.cnblogs.com/dhnblog/p/12301706.html" width="320" height="240">iframe>

Iframe - 移除边框:frameborder属性用于定义iframe表示是否显示边框,设置属性值为 "0" 移除iframe的边框

1 <iframe src="demo_iframe.htm" frameborder="0">iframe>

使用iframe来显示目录链接页面，iframe可以显示一个目标链接的页面,目标链接的属性必须使用iframe的属性额e.g:点击链接显示是在iframe里面

1 <iframe src="demo_iframe.htm" name="iframe_a">iframe>2 <p><a href="http://www.w3cschool.cn" target="iframe_a">W3CSCHOOL.CNa>p>
 1 <!DOCTYPE html> 2 <html> 3 <head>  4 <meta charset="utf-8">  5 <title>W3Cschool在线教程(w3cschool.cn)title>  6 head>  7 <body> 8 <iframe src="/statics/demosource/demo_iframe.htm" name="iframe_a">iframe> 9 <p><a href="https://www.w3cschool.cn" target="iframe_a">W3CSCHOOL.CNa>p>10 <p><b>注意：b> 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架，所以在点击链接时页面会显示在 iframe框架中。p>11 body>12 html>

HTML iframe 标签/

  • class规定元素的类名（classname）
  • id规定元素的唯一 id
  • style规定元素的行内样式（inline style）
  • title规定元素的额外信息（可在工具提示中显示）

HTML

1 <frameset>语法：frameset- 建立框架的标记，将在其中定义各个框架。/frame src- 指示框架显示内容URL地址。
 1 <html> 2  <head>head> 3  4  <frameset> 5    <frame src="menu.html"> 6    <frame src="content.html"> 7  frameset> 8 html> 9 10 <frameset> - 设置行列比例11 <frameset>标签中我们使用rows设置行的占页面的百分比；cols设置列的所占百分比。12 <html>13   <head>head>14     15   <frameset rows="20%,*">16       <frame src="title.html">17       <frameset cols="30%,*">18           <frame src="menu.html">19           <frame src="content.html">20       frameset>21   frameset>22 html>

frameset cols- 确定每个框架列所占百分比。在前面的示例中，我们已经确定第一框架将占据所示区域的30％，并且我们使用“*”符号来指示剩余百分比。
frameset rows- 确定将显示的每个框架行所占百分比。在前面的示例中，我们选择第一框架为20％，剩下的剩余空间将在menu.html和content.html之间划分。

 1 <html> 2   <head>head> 3  4   <frameset border="0" frameborder="0" framespacing="0" rows="20%,*"> 5       <frame src="title.html"> 6       <frameset border="0" frameborder="0" framespacing="0" cols="30%,*"> 7           <frame src="menu.html"> 8           <frame src="content.html"> 9       frameset>10   frameset>11 html>

frameborder-设置边框， 0值表示没有边框/border- 修改边框的粗细（由Netscape浏览器使用）/framespacing- 修改边框的粗细（由Internet Explorer浏览器使用）

 1 <html> 2   <head>head> 3  4   <frameset rows="20%,*"> 5       <frame name="title" src="title.html"> 6       <frameset cols="30%,*"> 7       <frame name="menu" src="menu.html"> 8       <name="content" src="content.html">     9       frameset>10   frameset>11 html>

 1 <html> 2   <head>head> 3      4   <frameset border="2" frameborder="1" framespacing="2" rows="20%,*"> 5       <frame src="title.html" noresize scrolling="no"> 6       <frameset border="4" frameborder="1" framespacing="4" cols="30%,*"> 7           <frame src="menu.html" scrolling="auto" noresize> 8           <frame src="content.html" scrolling="yes" noresize> 9       frameset>10   frameset>11 html>

拓展：网页DIV+CSS布局与ifame传统布局对比

概括：关于iframe与frame的区别在我看来：iframe翻译过来是嵌套，其实就是把别的页面嵌套到自己的页面进来；而这个frame是frameset实现局部刷新的基石，没有frame，frameset就无法实现局部刷新,同时要注意的是frameset与body不能同时出现!