Basic examples
More attributes of <frame>
Nested frames
<iframe> Tag
By default, the browser uses a window to render an HTML document. The window can be divided into several sub-windows.
- Each sub-window is called a frame .
- Each frame can be used to render an individual HTML document.
- We say that, the main window of the browser contains a set of frames, ( frameset ).
If we want to generate an HTML document that contain frames, we need:
- A main HTML document that contains nothing but information about how to divide the main window of the browser into frames and what to be placed in those frames.
- Several HTML documents; each of them is designed for a particular frame. Usually, they are normal HTML documents, but when you design an HTML document for a particular frame, you must keep in mind about the size and properties of the frame where the document will be rendered.
<FRAMESET> and <FRAME> tags
- <FRAMESET> defines the set of frames. The end tag </FRAMESET> is needed.
- <FRAME> defines the properties of a frame in the frameset .
Back to the top
Two Blank Frames in Columns
<html>
<head> <title>Two Blank Frames</title> </head>
<frameset cols="20%,*">
<frame>
<frame>
</frameset>
</html>
Click
here to see the above HTML document.
The <a> tag in the text "here" above is written as:
<a target="_blank",
href="two_col_b_frames.html">
here </a>
Two Blank Frames in Rows
<html>
<head> <title>Two Blank Frames</title> </head>
<frameset rows="50%,50%">
<frame>
<frame>
</frameset>
</html>
Click
here to see the above HTML document.
Six Blank Frames
<html>
<head> <title>Six Blank Frames</title> </head>
<frameset rows="10%,50%,*" cols="20%,80%">
<frame>
<frame>
<frame>
<frame>
<frame>
<frame>
</frameset>
</html>
Click
here to see the above HTML document.
Two Frames
<html>
<head> <title>Two Frames</title> </head>
<frameset cols="20%,*">
<frame name="left" src="left_clicks.html">
<frame name="right" src="frames.html">
</frameset>
</html>
Click
here to see the above HTML document.
Four Frames
<HTML>
..........
<FRAMESET rows="40%,*" cols="50%,*">
<FRAME name="1" src="ff_clicks.html">
<FRAME name="2" src="http://www.colgate.edu">
<FRAME name="3" src="frames.html">
<FRAME name="4" src="http://cs.colgate.edu/~chungli">
</FRAMESET>
</HTML>
Click
here to see the above HTML document. The document will be rendered in this frame.
Back to the top
These attributes change the default setting of frames.
<HTML>
..........
<FRAMESET .....>
<FRAME name="a_name"
src="an_html_file_or_URL"
noresidz
scrolling="no"
frameborder="0"
<!-- "0" or "1" -->
marginwidth="20"
marginheight="30">
...............
<NOFRAME>
Text here will be shown if the browser does not support frame.
</NOFRAME>
</FRAMESET>
</HTML>
Click
here or here to see the effects.
border and bordercolor are two attributes of <FRAMESET>
<HTML>
..........
<FRAMESET border="0" bordercolor="red" cols=.....>
...............
</FRAMESET>
</HTML>
Click here to see the effects.
Back to the top
Every <FRAME> in a frameset can be replaced by another frameset defined by a pair of <FRAMESET> and </FRAMESET>; in such a way, we can have a set of frames in a frame.
Five Blank Frames (nested, frame in frame)
<html>
<head> <title>Five Nested Blank Frames</title> </head>
<frameset cols="30%,60%,10%">
<frame>
<frameset rows="10%,20%,*">
<frame>
<frame>
<frame>
</frameset>
<frame>
</frameset>
</html>
Click
here to see the above HTML document.
Seven Blank Frames (nested, frame in frame)
<html>
<head> <title>Seven Nested Blank Frames</title> </head>
<frameset cols="30%,60%,10%">
<frame>
<frameset rows="10%,20%,*">
<frame>
<frameset cols="33%,33%,*">
<frame>
<frame>
<frame>
</frameset>
<frame src="NorthAm.jpg">
</frameset>
<frame>
</frameset>
</html>
Click
here to see the above HTML document.
Back to the top
<IFRAME> tag creates a frame in an HTML body. This
is not a standard HTML tag.
<HTML>
..........
<IFRAME
name="a_name"
src="an_html_file_or_URL"
scrolling="no"
frameborder="0"
align="right"
marginwidth="5"
marginheight="5"
width="600"
height="500">
Text here will be shown if the browser does not support iframe.
</iframe>
</HTML>
World
North America
Taiwan
Colgate University
CS Department of Colgate
CC LI
This document
Dandelion
McGregory
Hall
One
Two
Three
Four