HTML – Frame Attributes

Below are <frameset> attributes explained.

Col Attribute

The vertical frames are given by the col attribute. The width, however, can be specified in 2 ways:

Pixels: An absolute value can be mentioned in pixels. If we have to create three vertical frames, we can give the value: cols=”100,50,100”.

Percentage: The percentage of the browser window can be mentioned. If we have to create three vertical frames, we can give the value: cols=”40%,20%,40%”.

Creating index.html

<html>
   <head>
      <title>This is document title</title>
   </head>	
   <frameset cols="25%,50%,25%">  
      <frame src="frames/frame1.html" >  
      <frame src="frames/frame2.html">   
      <frame src="frames/frame3.html">  
   </frameset> 
</html>

Creating Frame1.html

<html>
   <head>
      <title>This is document title</title>
   </head>	
   <body  style="background-color: #000;color: #fff;">
       <h1>Frame 1</h1>        
   </body> 
</html>

Creating Frame2.html

<html>
   <head>
      <title>This is document title</title>
   </head>	
   <body  style="background-color: #2f4f4f;color: #fff;">
        <h1>Frame 2</h1>        
   </body>
</html>

Creating Frame3.html

<html>
   <head>
      <title>This is document title</title>
   </head>	
   <body  style="background-color: #ccc;color: #fff;">
        <h1>Frame 3</h1>        
   </body>
</html>

We can also make use of the wildcard here (*) and let the wildcard take the remaining of the window which remains un-mentioned.

Index.html

<html>
   <head>
      <title>This is document title</title>
   </head>	
   <frameset cols="10%,*,25%">  
      <frame src="frames/frame1.html" >  
      <frame src="frames/frame2.html">   
      <frame src="frames/frame3.html">  
   </frameset> 
</html>

For frame1, frame2 and frame3, use the same above example file.

Rows attribute

The horizontal frames are given by the row attribute. It specifies the rows in a frameset. If we have to create three horizontal frames we use:

<html>
   <head>
      <title>This is document title</title>
   </head>	
   <frameset rows="15%,*,25%">  
      <frame src="frames/frame1.html" >  
      <frame src="frames/frame2.html">   
      <frame src="frames/frame3.html">  
   </frameset> 
</html>
 

For frame1, frame2 and frame3, use the same above example file.

Border

It specifies the width of the border of each frame in pixels.

border=”4”. If border=”0”, means there is no border.

Frameborder

If a three-dimensional border needs to be displayed between frames then we use this attribute. The value which the attribute takes is either 1 or 0 ( Yes or No).

frameborder=”0” means no border.

Framespacing

This attribute specifies the amount of space between frames in a frameset. Any integer value can be given here for this attribute.

framespacing=”12” means between the frames there should be the spacing of 12 pixels.

Let’s understand the working of border, frameborder and framespacing with the help of an example.

Index.html

<html>
   <head>
      <title>This is document title</title>
   </head>	
   <frameset rows="15%,*,25%" border="15" frameborder="1" framespacing="12">  
      <frame src="frames/frame1.html" >  
      <frame src="frames/frame2.html">   
      <frame src="frames/frame3.html">  
      </frameset> 
</html>

For frame1, frame2 and frame3, use the same above example file.

We can also control the UI of the frame tag using different attributes. Below are the eight attributes for the same:-

SRC Attribute

We provide the file name to this attribute that is supposed to be loaded into the frame. The value of this attribute can be any URL.

src= www.google.com

Name

This attribute provides a name to the frame. It defines which frame a document should be loaded into. 

If you have multiple links in one frame which loads into another frame then we make use of this attribute. Then the second frame needs a name to identify itself as the target of the link.

name= ”test.html”

Frameborder

This attribute is specified to show if the borders are to be shown or not. The value takes up is 1 or 0 (Yes or No).

frameborder= 1

Marginwidth

The attribute is helpful at specifying the width of the space between the left and right of the frame’s border and also the content of the frame. The value is given in pixel.

marginwidth= “10”

Marginheight

The attribute is helpful at specifying the height of the space between the top and the bottom of the frame’s border and also the content of the frame. The value is given in pixel.

marginheight= “10”

Noresize

This attribute basically prevents the user from making any changes to the already present frames. In the absence of this attribute, any frame can be resized.

noresize=”noresize”

Scrolling

This attribute takes control of the appearance of the scrollbars which are present on the frame. The values either are a ‘yes’, ‘no’, or an ‘auto’.

scrolling=” no” means it should not have scroll bars.

Long desc

This attribute lets you provide a link to another page containing a long description of the content of the frame. longdesc=”frame.html”

Supporting Browsers

ElementChromeIEFirefoxOperaSafari
<frame>YesYesYesYesYes