Wednesday 30 October 2013

HTML School Article: How to create Frames in HTML.

HTML frames are the nice way to divide the browser screen into several frames and display the content. It allow authors to present documents in multiple views, which may be independent windows or subwindows. This was the feature of HTML 4.01, although frames are not supported in HTML 5.

Frameset Rows and columns
Rows attribute create frames in horizontal and Cols create frames in vetical. Both attributes may be set simultaneously to create a grid.
If the rows attribute is not set, each column extends the entire length of the page. If the cols attribute is not set, each row extends the entire width of the page. If neither attribute is set, the frame takes up exactly the size of the page.

So, Now we will creating a webpage with 2 vertical and one horizontal frame. I am writing my own example how i created the files and added in frameset. You can do this in your own way too, but take care of references well.

1. Create a new Folder in desktop, In this folder we will be saving all our webpages together.

2. Now we will be creating 3 different html files which we want to add in different frames, namely head.html,list.html main.html(add any content you want to add) . these 3 files will be the frame src which will display these as a content in different frames.

 3.Create a new html file, name it(in mycase i named it indexa.html) and add the following code to it:

<html>
<head>
<title>Frameset Page</title>
</head>
<frameset>
<frameset rows="20%,100%">
<frame src="head.html">

<frameset cols="50%,50%">
<frame src="list.html" name="left">
<frame src="main.html" name="right">
</frameset>
</html>

Note: frameset mark the starting of frameset.
frame src attribute specifies the URL of the document which we want to show in a frame.
In this I have added one row , and 2 columns dividing 50% both. You can see it in screnshot.


As you can see, The top row content is derived from head.html file, and the content of 2 rows is derived from list.html and main.html. 

4.Thats all!! I hope, Now you will be able to create a frameset in HTML.