HTML Frames

1
HTML Frames
2
Frames

• With frames, you can display more than one HTML
  document in the same browser window. Each HTML
  document is called a frame, and each frame is
  independent of the others.
• The disadvantages of using frames are
• The web developer must keep track of more HTML
  documents
• It is difficult to print the entire page

3
The Frameset Tag

• The ltframesetgt tag defines how to divide the
  window into frames
• Each frameset defines a set of rows or columns
• The values of the rows/columns indicate the
  amount of screen area each row/column will occupy
  

4
The Frame Tag

• The ltframegt tag defines what HTML document to put
  into each frame
• In the example below we have a frameset with two
  columns. The first column is set to 25 of the
  width of the browser window. The second column is
  set to 75 of the width of the browser window.
  The HTML document "frame_a.htm" is put into the
  first column, and the HTML document "frame_b.htm"
  is put into the second column
• ltframeset cols"25,75"gt
• ltframe src"frame_a.htm"gt   
• ltframe src"frame_b.htm"gt
• lt/framesetgt

5
Basic Notes - Useful Tips

• 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"noresize" to the ltframegt tag.
• Add the ltnoframesgt tag for browsers that do not
  support frames.

6
Frame Tags
7
Vertical Frameset

• lthtmlgt
• ltframeset cols"25,50,25"gt
• ltframe src"tryhtml_frame_a.htm"gt
• ltframe src"tryhtml_frame_b.htm"gt
• ltframe src"tryhtml_frame_c.htm"gt
• lt/framesetgt
• lt/htmlgt

8
Horizontal Frameset

• lthtmlgt
• ltframeset rows"25,50,25"gt
• ltframe src"tryhtml_frame_a.htm"gt
• ltframe src"tryhtml_frame_b.htm"gt
• ltframe src"tryhtml_frame_c.htm"gt
• lt/framesetgt
• lt/htmlgt

9
No Frames

• lthtmlgt
• ltframeset cols"25,50,25"gt
• ltframe src"tryhtml_frame_a.htm"gt
• ltframe src"tryhtml_frame_b.htm"gt
• ltframe src"tryhtml_frame_c.htm"gt
• ltnoframesgt
• ltbodygtYour browser does not handle frames!
• lt/bodygt
• lt/noframesgt
• lt/framesetgt
• lt/htmlgt

10
Mixed Frameset

• lthtmlgt
• ltframeset rows"50,50"gt
• ltframe src"tryhtml_frame_a.htm"gt
• ltframeset cols"25,75"gt
• ltframe src"tryhtml_frame_b.htm"gt
• ltframe src"tryhtml_frame_c.htm"gt
• lt/framesetgt
• lt/framesetgt
• lt/htmlgt

11
Frameset with no resize

• lthtmlgt
• ltframeset rows"50,50"gt
• ltframe noresize"noresize" src"tryhtml_frame_a.ht
  m"gt
• ltframeset cols"25,75"gt
• ltframe noresize"noresize" src"tryhtml_frame_b.ht
  m"gt
• ltframe noresize"noresize" src"tryhtml_frame_c.ht
  m"gt
• lt/framesetgt
• lt/framesetgt
• lt/htmlgt

12
Navigation Frames

• lthtmlgt
• ltframeset cols"120,"gt
• ltframe src"tryhtml_contents.htm"gt
• ltframe src"tryhtml_frame_a.htm"
• name"showframe"gt
• lt/framesetgt
• lt/htmlgt

13
Inline Frames

• lthtmlgt
• ltbodygt
• ltiframe src"default.asp"gtlt/iframegt
• ltpgtSome older browsers don't support iframes.
• lt/pgt
• ltpgtIf they don't, the iframe will not be
• visible.lt/pgt
• lt/bodygt
• lt/htmlgt