Thursday 11 September 2014

HTML Frames



Lecture 5
HTML Advance Tags – 

Today we will learn about HTML Frames tag. 

HTML Frame: HTML frames are used to divide or split browser window in several individual frames or parts that can contain a separate HTML document.

Advantages of Frames:
  • It improves usability and appearance of a Webpage.
  • We can open a webpage in desired frames without opening new window in web browser.
  • It reduces downloading time.

For using frames in HTML document, we take help of following two tags-
  1. <frame set> tag – <body> tag is replaced by <frameset> tag to use concept of frames. Or <body> tag is not used in any HTML webpage that contains <frameset> tag.
                             Attributes of <frameset> tag:
 


 
  2. <frame> tag :Frame tag is used to add HTML document into the frameset.
 
                       Attributes of <frame> tag:



           Example:
 Explanation: In this example we use <frameset> tag in place of <body> tag. We use frameset ’s rows attribute to divide browser window into two rows of 40% and 60%. Then we use two <frame> tags to put the html document into each row of frameset. In browser window, two rows showing nothing as we put ‘#’ in ‘src’ attribute. You can put any html documents name with extension (.html) to show in frameset in browser window, like <frame src=”name.html”>.



Types of Frameset: There are 3 types of frameset –

  1.       Row type frameset –
Explanation: In this, we use <frameset> tag in place of <body> tag. We use frameset’s rows attribute to divide browser window into two rows of 40% and 60%. Then we use two <frame> tags to put the html document into each row of frameset. In browser window, two rows showing nothing as we put ‘#’ in ‘src’ attribute. You can put any html documents name with extension (.html) to show in frameset in browser window, like <frame src=”name.html”>.


  2.      Column type frameset –

 

Explanation: In this, we use <frameset> tag in place of <body> tag. We use frameset’s cols attribute to divide browser window into two columns of 50% each. Then we use two <frame> tags to put the html document into each row of frameset. In browser window, two columns showing nothing as we put ‘#’ in ‘src’ attribute. You can put any html documents name with extension (.html) to show in frameset in browser window, like <frame src=”name.html”>.



3.      3.    Mixed type frameset – which include both rows and columns.


Explanation: In this, we use <frameset> tag in place of <body> tag. We use frameset ’s rows attribute to divide browser window into two rows of 50% each. Then we use <frame> tags to put the html document into first row of frameset. In second row, we use <frameset> tag again to divide second row. In second <frameset> tag, we use ‘cols’ attribute to divide second row into two columns of 40% and 80%. In Browser window, all frames showing nothing as we put ‘#’ in ‘src’ attribute. You can put any html documents name with extension (.html) to show in frameset in browser window, like <frame src=”name.html”>.






Note: In Next lecture, we will learn HTML Form and their different elements.


No comments:

Post a Comment