A frame is a section of the browser window capable of displaying the contents of an entire web page. For example, a frame on the left could have a menu with links while the frame on the right displayed the contents of the page you linked to.
Note: we're going to discuss frames because you may come in contact with them in older sites. Mostly designers now use style sheets to accomplish the same look as a frame, and sites with style sheets are less likely to break than one with frames.
You need to plan your frames before you start. There are several things to consider:
In order to create frames you need two elements. First you need a "frameset" element that describes how the frames are organized and displayed within the browser, and second the "frame" elements which define which documents are displayed within each frame. Of course, you will also need the other web pages you want to display in the frames.
<html>
<head>
<title> Always have a title </title>
</head>
<frameset>
frames are defined here
</frameset>
</html>
Notice that the frameset replaces the body element. This is because this page displays the contents of other pages, it is not technically a web page – therefore it does not have a body element.
Frames in a frameset can be in either rows or columns, but not both. That is, you can have either
<frameset cols=”col1,col2,col3”>....</framest>
where coln is the width of each frame column.
or
<frameset rows=”row1,row2,row3”>...</frameset>
where rown is the height of each frame row.
There is no limit to the number of rows or columns you can specify in a frameset, except the practical limit.
Row and column sizes can be specified in 3 ways; pixels, percentage or *.
The * tells the browser to allocate any unclaimed space. You can use all 3 or any combination in a frameset, but it is a good idea to have at least one * to ensure that the browser window is filled.
<frameset rows=”*,*,*”> will create 3 rows of frames with equal heights.
<frame src=”url” /> where url is the document you want displayed in the frame.
If you want both rows and columns in your design, there is a way to do it even though you can only have rows or columns within any particular frameset. You do it with nested framesets:
<frameset rows=”25%,*”>
<!--describe the document -->
<frame src=”url” />
<frameset cols=”*,*” > <!-- gives 2 equal
sized cols-->
<!--links go in this frame-->
<frame src=”url” />
<!--content goes in this frame-->
<frame src=”url” />
</frameset>
</frameset>
There are 3 attributes of a frame that you can control:
Hiding and displaying scroll bars
By default, a scroll bar will appear when the content in the source page does not fit within a frame. You can override this:
Scrolling=”type”
where type can be yes (to always display a scroll bar) or no (to never display a scroll bar).
Setting frame margins
You can control the size of the frame margin:
marginheight=”value”
marginwidth=”value”
where value is the amount of space in pixels. If you use only one, the browser will use the same value for the other. Setting the margins is a process of trial and error. Try a value, look at the page and decide if it is what you want.
Frame resizing
By default, users can resize frames within a browser by simply dragging a frame border. Many times, you want the frames to stay a particular size so you can specify that the user cannot do this:
noresize=”noresize”
or just
noresize