Working with Frames in HTML

You can divide the browser window into frames (two partitions). You can create any number of frames as per your needs. A frame is created by using <FRAMESET> tag.

A minimum of two html files are needed to create a web page with Frames. Path to html files are specified using <FRAME> tags src attribute.

Try out the example given below:

<pre style="background-color: #ffffff; margin: 0em; width: 100%; font-family: consolas,&#39;Courier New&#39;,courier,monospace; font-size: 12px"><p><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAMESET</span> <span style="color: #ff0000">rows</span> = <span style="color: #0000ff">&quot;10%,*&quot;</span><span style="color: #0000ff">&gt;</span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAME</span> <span style="color: #ff0000">src</span> = <span style="color: #0000ff">&quot;first.html&quot;</span><span style="color: #0000ff">&gt;</span></p><p><span style="color: #0000ff"></span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAME</span> <span style="color: #ff0000">src</span> = <span style="color: #0000ff">&quot;second.html&quot;</span><span style="color: #0000ff">&gt;</span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAMESET</span><span style="color: #0000ff">&gt;</span></p>

This creates a frame of rows. first.html occupies the first 10% and remaining space will be occupied by second.html file. Keep in mind that if you try to insert <BODY> tag, the frame will not appear on the screen

Attributes used with Frameset Tag

cols: Frames will appear in columns

Bordercolor: Changes the border color of the Frame.

FrameBorder: The possible values are 0 or 1. The frame border will be invisible if you apply 0.

Attributes used with Frame Tag

No resize: Frame Border will not be sizable.

Scrolling: Yes or No. If No, Scrollbars will not appear.

Here is an another example of Nesting of Frames. Here two rows are created and the bottom frame is divided into two columns. Like this we can apply any number of frames provided each such frame should accommodate HTML Files. However, I recommend you to restrict the frame divisions so that the web page looks neat and easier to navigate.

<pre style="background-color: #ffffff; margin: 0em; width: 100%; font-family: consolas,&#39;Courier New&#39;,courier,monospace; font-size: 12px"><p><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAMESET</span> <span style="color: #ff0000">rows</span> = <span style="color: #0000ff">&quot;10%,*&quot;</span><span style="color: #0000ff">&gt;</span></p><p><span style="color: #0000ff"></span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAME</span> <span style="color: #ff0000">src</span> = <span style="color: #0000ff">&quot;first.html&quot;</span><span style="color: #0000ff">&gt;</span></p><p><span style="color: #0000ff"></span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAMESET</span> <span style="color: #ff0000">cols</span> = <span style="color: #0000ff">&quot;50%,*&quot;</span><span style="color: #0000ff">&gt;</span></p><p><span style="color: #0000ff"></span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAME</span> <span style="color: #ff0000">src</span> = <span style="color: #0000ff">&quot;second.html&quot;</span><span style="color: #0000ff">&gt;</span></p><p><span style="color: #0000ff"></span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAME</span> <span style="color: #ff0000">src</span> = <span style="color: #0000ff">&quot;third.html&quot;</span><span style="color: #0000ff">&gt;</span></p><p><span style="color: #0000ff"></span><span style="color: #0000ff">&lt;</span><span style="color: #800000">FRAMESET</span><span style="color: #0000ff">&gt;</span></p>

Leave a Reply

Your email address will not be published.