HTML Frames
1.Frameset Tag
2.Frame Tag
3.Designing with Frames
With frames, you can display more than one HTML document in the same browser window
Each HTML document is called a frame,
each frame is independent of others.
Disadvantages of using frames:
1.The web developer must keep the track of other html dicuments
2.It is deficult to print the entaire page
3.Users often dislike them
4.It presents linking challenges
5.People often use frames to wrap their own ads and branding around other people's content
frameset Tag
The <frameset> tag defines how to divide the window into frames.
Each frameset defines set of rows and columns.
The values of the rows/columns indicate the amount of screen area each row/column will occupy.
Vertical Frameset
vertical frameset with three different documents.
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>
</html>
Note: code does not use the <body> tag when a <frameset> tag is in use.
Horizontal Frameset
hotizontal frameset with three different documents.
<html>
<frameset rows="25%,50%,25%">
<frame src="frame_a.htm>
<frame src="frame_b.htm>
<frame src="frame_c.htm>
</frameset>
</html>
frame Tag
The <frame> tag defines the which HTML document initially open in each frame.
<frameset cols="25%,75%">
<frame src="frame_a.htm>
<frame src="frame_b.htm>
</frameset>
Note: frameset values can also be set in pixels (cols="200,500")
one of the column can be set to use the remaining space (cols="25%,*)
Designing with Frames
if a frame has visible borders, the user can resize it by dragging the border.
to prevent a user from doing this, you can add "noresize" to the <frame> tag.
noframes Tag
although they are less common these days, it's good idea to add the <noframes> tag for older or text based browsers that do not support frames
you cannot use the <body> tags together with the <frameset>tags.
however, if you add a <noframes> tag containing some text for browsers that do not support frames, you will have enclose the text in <body> tags
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm">
<frmae src="frame_b.htm">
<frame src="frame_c.htm">
<noframes>
<body> your browser doesnot handle frames!</body>
</noframes>
</frameset>
</html>
Mixed Frameset
<html>
<frameset rows="50%,50%">
<frame src="frame_a.htm">
<frameset cols="25%,75%">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>
</frameset>
</html>
noresize Attribute
<html>
<frameset rows="50%,50%">
<frame noresize="noresize" src="frame_a.htm">
<frameset cols="25%,75%">
<frame noresize="noresize" src="frame_b.htm">
<frame noresize="noresize" src="frame_c.htm">
</html>
Navigation Frame
A navigation frame contains a list of links with the second frame as the target.
The second frame will show the linked document.
<html>
<frameset cols="120,*">
<frame src="tryhtml_contents.htm">
<frmae src="frame_a.htm" name="showframe">
</frameset>
</html>
the file called tryhtml_contents.htm contains links to three documents on thew3schools.com website.
<a href="frame_a.htm" target="showframe">Frame a</a><br/>
<a href="frame_b.htm" target="showframe">Frame b</a><br/>
<a href="frame_c.htm" target="showframe">Frame c</a><br/>
Inline Frame
Frames can also be used within a single HTML page.
These are known as inline frames.
<html>
<body>
<iframe src="default.asp"></iframe>
<p>some older browsers don't support iframes.</p>
<p>If they don't, the iframe will not be visible</p>
</body>
</html>
Jump to
This example demonstrates two frames.
one of the frame has a source to a specified section in a file.
the specified section is made with <a name="C10"> in the link.htm file
<html>
<frameset cols="20%,80%">
<frame src="frame_a.htm">
<frame src="link.htm#C10">
</frameset>
</html>
Jump to a specified section
<html>
<frameset cols="180,*">
<frame src="content.htm">
<frame src="link.htm" name="showframe">
</frameset>
</html>
<a href="link.htm" target="showframe">Link without Anchor</a><br>
<a href="link.htm#C10" target="showframe">Link with Anchor</a>
Frame Tags
TAG Description
<frameset> Defines a set of frames
<frame> Defines a sub window (a frame)
<noframe> Defines a noframe section for browsers that do not handle frames
<iframe> Defines an inline sub window(frame)
1.Frameset Tag
2.Frame Tag
3.Designing with Frames
With frames, you can display more than one HTML document in the same browser window
Each HTML document is called a frame,
each frame is independent of others.
Disadvantages of using frames:
1.The web developer must keep the track of other html dicuments
2.It is deficult to print the entaire page
3.Users often dislike them
4.It presents linking challenges
5.People often use frames to wrap their own ads and branding around other people's content
frameset Tag
The <frameset> tag defines how to divide the window into frames.
Each frameset defines set of rows and columns.
The values of the rows/columns indicate the amount of screen area each row/column will occupy.
Vertical Frameset
vertical frameset with three different documents.
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>
</html>
Note: code does not use the <body> tag when a <frameset> tag is in use.
Horizontal Frameset
hotizontal frameset with three different documents.
<html>
<frameset rows="25%,50%,25%">
<frame src="frame_a.htm>
<frame src="frame_b.htm>
<frame src="frame_c.htm>
</frameset>
</html>
frame Tag
The <frame> tag defines the which HTML document initially open in each frame.
<frameset cols="25%,75%">
<frame src="frame_a.htm>
<frame src="frame_b.htm>
</frameset>
Note: frameset values can also be set in pixels (cols="200,500")
one of the column can be set to use the remaining space (cols="25%,*)
Designing with Frames
if a frame has visible borders, the user can resize it by dragging the border.
to prevent a user from doing this, you can add "noresize" to the <frame> tag.
noframes Tag
although they are less common these days, it's good idea to add the <noframes> tag for older or text based browsers that do not support frames
you cannot use the <body> tags together with the <frameset>tags.
however, if you add a <noframes> tag containing some text for browsers that do not support frames, you will have enclose the text in <body> tags
<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.htm">
<frmae src="frame_b.htm">
<frame src="frame_c.htm">
<noframes>
<body> your browser doesnot handle frames!</body>
</noframes>
</frameset>
</html>
Mixed Frameset
<html>
<frameset rows="50%,50%">
<frame src="frame_a.htm">
<frameset cols="25%,75%">
<frame src="frame_b.htm">
<frame src="frame_c.htm">
</frameset>
</frameset>
</html>
noresize Attribute
<html>
<frameset rows="50%,50%">
<frame noresize="noresize" src="frame_a.htm">
<frameset cols="25%,75%">
<frame noresize="noresize" src="frame_b.htm">
<frame noresize="noresize" src="frame_c.htm">
</html>
Navigation Frame
A navigation frame contains a list of links with the second frame as the target.
The second frame will show the linked document.
<html>
<frameset cols="120,*">
<frame src="tryhtml_contents.htm">
<frmae src="frame_a.htm" name="showframe">
</frameset>
</html>
the file called tryhtml_contents.htm contains links to three documents on thew3schools.com website.
<a href="frame_a.htm" target="showframe">Frame a</a><br/>
<a href="frame_b.htm" target="showframe">Frame b</a><br/>
<a href="frame_c.htm" target="showframe">Frame c</a><br/>
Inline Frame
Frames can also be used within a single HTML page.
These are known as inline frames.
<html>
<body>
<iframe src="default.asp"></iframe>
<p>some older browsers don't support iframes.</p>
<p>If they don't, the iframe will not be visible</p>
</body>
</html>
Jump to
This example demonstrates two frames.
one of the frame has a source to a specified section in a file.
the specified section is made with <a name="C10"> in the link.htm file
<html>
<frameset cols="20%,80%">
<frame src="frame_a.htm">
<frame src="link.htm#C10">
</frameset>
</html>
Jump to a specified section
<html>
<frameset cols="180,*">
<frame src="content.htm">
<frame src="link.htm" name="showframe">
</frameset>
</html>
<a href="link.htm" target="showframe">Link without Anchor</a><br>
<a href="link.htm#C10" target="showframe">Link with Anchor</a>
Frame Tags
TAG Description
<frameset> Defines a set of frames
<frame> Defines a sub window (a frame)
<noframe> Defines a noframe section for browsers that do not handle frames
<iframe> Defines an inline sub window(frame)
No comments:
Post a Comment