HTML Frame

By using frames, you can display more than one page in the same browser window.

HTML Frames is a technique to divide the browser window into multiple sections. Each of these sections can load a separate HTML document.

Example


iframe syntax:

<iframe src=" URL "></iframe>

The URL points to a different web page.

The <iframe> tag specifies an inline frame. An inline frame is used to embed another document within the current HTML document.


iframe – set height and width

The height and width properties are used to define the height and width of the iframe tag.

The property defaults to pixels, but you can specify it to be displayed proportionally (eg “80%”).

Example


<html>
<head> 
<meta charset="utf-8"> 
<title>HTML Tutorial (tutorialsbyte.com)</title> 
</head> 
<body>
<iframe src="home.htm" width="200" height="200"></iframe>
<p>Some older browsers do not support iframes.</p>
<p>If the browser does not support iframes it will not be displayed</p>
</body>
</html>

iframe – remove border

The frameborder property is used to define whether the iframe represents a border or not.

Set the property value to “0” to remove the iframe’s border:

Example

<iframe src="home.htm" frameborder="0"></iframe>

Use an iframe to display the target linked page

<iframe> can display a target linked page

The attributes of the target link must use the attributes of the <iframe>, as in the following example:

Example


<html>
<head> 
<meta charset="utf-8"> 
<title>HTML Tutorials</title> 
</head> 
<body>
<iframe src="home.htm" name="iframe_a"></iframe>
<p><a href="https://www.tutorialsbyte.com" target="iframe_a">Tutorialsbyte.com</a></p>
<p>Note: Because the target attribute of the a tag is the iframe frame named iframe_a, the page will be displayed in the iframe frame when the link is clicked.</p>
</body>
</html>

HTML iframe tag

LabelDescribe
<iframe>Define an inline iframe