HTML | frameset Tag

In this tutorial, you will learn how to divide browser window into multiple sections with each section having its own content.

HTML <frameset> Tag


The <frameset> tag in HTML is used to define the frameset. The <frameset> element contains one or more frame elements.

Syntax:

<frameset cols = "pixels|%|*">

Attributes:

  • cols: The cols attribute is used to create vertical frames in web browser. This attribute is basically used to define the no of columns and its size inside the frameset tag.
  • rows: The rows attribute is used to create horizontal frames in web browser. This attribute is used to define no of rows and its size inside the frameset tag.
Value of cols and rows can be provided in pixels, % or *.

Creating Vertical Frames

To create a set of vertical frames, we need to use the frameset element with the cols attribute.

The cols attribute is used to define the number and size of columns. We have three files to display in different sections vertically.

example:

<html>
<frameset cols="20%,30%,*">
<frame src="frame1.html">
<frame src="frame2.html">
<frame src="frame3.html">
</frameset>
</html>

Inside <frameset> tag, <frame> elements will be added for each section. Each <frame> element has src attribute with resource url.

frame1.html will display vertically in browser window covering 20% space. Similarly frame2.html will be in 30% of browser windows. frame3.html will display in remaining space as * is provided.

Ouput:

Creating Horizontal Frames

To create a set of horizontal frames, we need to use the frameset element with the rows attribute.

The rows attribute is used to define the number and size of rows .We have three files to display in different sections horizontally.

example:

<html>
<frameset rows="20%,30%,*">
<frame src="frame1.html">
<frame src="frame2.html">
<frame src="frame3.html">
</frameset>
</html>

Inside <frameset> tag, <frame> elements will be added for each section. Each <frame> element has src attribute with resource url.

Ouput:

For live demo, follow Youtube video link:

Comments

Popular Posts

How to Import and Export Delimited Files, like CSV, in PowerShell

PowerShell Arithmetic Operators

How to generate a GUID in PowerShell