A, iframe usage
Two, frame usage
Three, frameset usage
Fourth, the difference between the contrast
iframe
A usage, iframe attributes
<Iframe> tag a predetermined inline frames. Inline frame can be inserted into the frame in the current HTML document, you can link to another page within the framework of
It is a mark of containment, but around the words only appear when the browser does not support iframe tags.
<html> <head></head> <body> <iframe src="xxx.html"></iframe> </body> </html>
Note: All browsers support iframe attributes, you can put the required text is placed between <iframe> and </ iframe>, so that you can respond not understand <iframe> browser.
Css to be used for the <iframe> define style
Second, the value of the property iframe
- frameborder predetermined frame is displayed around the border value is 1 or 0. (A value of 1 has a border value of 0 is no border) may also be a yes or no.
- / Predetermined height and width of the frame width height (px or% value)
- URL of the document in a frame displayed src provisions
- scrolling the scroll bar is displayed in a predetermined frame (yes value display, no display is not, auto automatically determine)
- Align a predetermined frame alignment (value of left, right, top, middle, bottom)
- name Specifies the name of an inline frame
- Top and bottom frame marginheight from the outside (pixel value of a pixel)
- Marginwidth outside from the left and right frame (the pixel value of pixel)
iframe writing format
<Iframe src = "iframe.html" height = "100px" width = "300px" marginheight = 1px marginwidth = 1px name = "ibox" align = "middle" frameborder = 1> the contents inside only do not support iframe tag in the browser when will be displayed </ iframe>
HTML iframe support global attributes, and also supports event attributes
frameset
A, frameset usage (frame template)
You can define a set of frame frameset. Is used to organize multiple frames, each frame have a separate document. In simple applications the frameset, or frameset rows cols used to specify how many rows many attributes listed in the present frame.
<html>
<head></head>
<frameset>
<frame src="">
<frame src="">
</frameset>
</html>
! Note: using frameset frame and the frame can be made into different page sizes required, the layout can be used.
frameset element defines a frameset. It is used to organize a plurality of windows (frames). Each frame there separate document. using rows cols frameset element or attribute specifies how many rows or columns in the presence of concentrated frame.
You can not use <body> </ body> tag and <frameset> </ frameset> tag together. When you need to add a <noframes> tag is not supported by the framework of the browser, it must nest <body> tag in the <noframes>, the content as noframes tag will be displayed.
Second, the attribute value of the attribute frameset
frameset cols defined number and size of columns (values px,%, and *)
frameset rows defined number and size of rows (value of px,%, and *)
Note: these two attributes are accepted by quotation marks and comma-separated list of values, which specify the absolute values (pixels) of the frame or relative (or percentage of remaining space) width (in terms of columns), or the absolute or relative height (for the row). The number of these property values determine the browser frame number of rows or columns will be displayed in the document window.
Example:
1, the frame constructing three rows (rows as there are three values), the height of three lines respectively 150px, 300px, 150px (three rows of a height of 1: 2: 1)
<frameset rows="150,300,150">
Unless exactly 600px browser window, the browser will automatically or in accordance with (three rows height ratio of 1: 2: 1) extension or compression of the first and last frame, two upper and lower window frame occupies space 1/4;
Middle frame will occupy the remaining 1/2 of the space.
<frameset rows="25%,50%,25%">
Percentages add up to 100% if not set (e.g., 20%, 40%, 20%), the ratio between the browser will be given according to the re-sized to eliminate the difference.
2, addition of an asterisk * values in rows and cols <frameset> tag usage. * After instructs the browser to be placed adjacent frame set in the framework of the rest of the space allocated to each row or column.
Generates a frame fixed column width of 100px, columns and other frame, the frame columns occupy all remaining space frame set.
<frameset cols="100,*,*">
3、对多个列或行属性值使用星号。在这样的情况下，相应的行或列将对可用空间进行等分。
<frameset cols="*,100,*">
生成三列，中间一列固定宽度100px，左右两侧分别生成尺寸相同的两列。等分剩下的空间。
4.如果在星号前放置一个整数值，相应的行或列就会相对地获得更多的可用空间
<frameset rows="100,3*,*,*">
生成四行框架，第一行框架集的10%。浏览器把框架集剩下的空间3/5分配给第二个框架，剩下两行各分1/5.
补充：noframes标签
当浏览器完全显示不出这个框架时，页面就会显示出<noframes></noframes>内的内容。<noframes> 元素位于 <frameset> 元素内部。
<frameset>如果浏览器有能力处理框架，就不会显示出 frameset 元素中的文本。</frameset>
如果希望在<frameset>标签中使用<noframes>标签，就必须要把<noframes>的内容包含在<body></body>中；
<frameset cols = "25%, 25%,*"> <noframes> <body>Your browser does not handle frames!</body> </noframes> <frame src ="venus.htm" /> <frame src ="sun.htm" /> <frame src ="mercur.htm" /> </frameset>
frame
一、frame的作用
<frame>定义frameset中的一个特定的窗口。只设定某一个框架窗口的特定属性。
注意：<frame>标签一定要和<frameset>标签一起合用。frame是自闭合标签没有结束标签。
<html> <frameset cols="25%,50%,25%"> <frame src=" " /> <frame src=" " /> <frame src=" " /> </frameset> </html>
二、frame标签的属性
- frameborder 规定是否显示框架周围的边框，取值为1或0。(取值为1有边框，取值为0没有边框)也可以是yes或no。
- noresize 规定用户无法调整框架的大小（noresize="noresize"）
- src 规定在框架中所显示的文档的URL
- scrolling 规定是否在框架中显示滚动条（取值yes显示，no不显示，auto自动判断）
- name 规定内联框架的名称
- marginheight 框架顶部和底部的外边距（取值pixel像素）
- marginwidth 框架左侧和右侧的外边距（取值pixel像素）
三、实例
1、不能调整框架的大小
设置了noresize属性的框架不可以调整大小，当把鼠标移动到框架的表上时会发现边框不可以移动。
<html> <frameset> <frame src="nav.html" noresize="noresize"/> <frame src="main.html"/> <frame src="content.html"/> </frameset> </html>
总结区别
经过上面的分析，总结iframe、frame、frameset三者之间的区别和联系。
1、frame不能脱离frameset单独使用，而iframe可以单独使用
2、frameset不能放在body标签中，frame嵌套在frameset中如果放在body中不能正常显示。（frameset和frame只规定了框架如何划分，不会显示任何内容，所以不需要放在body中）
3、iframe嵌套在frameset标签中，则必须放在body标签中，否则无法显示。（iframe用来显示引用的其他页面的内容，需要被显示，放在body）
4、frame不能调整框架的宽高，只能通过frameset间接设置；iframe可以通过width和height属性来调整宽高，不能通过frameset控制
5、frameset不能被浏览器解读的时候，如果里面设置了noframes就会显示出来noframes标签内的内容。