Search Bar

HTML Iframes

Amol Gadage April 13, 2018

HTML Iframes



An iframe is used to display a web page within a web page.



You can define an inline frame with HTML tag <iframe>. The <iframe> tag is not somehow related to <frameset> tag, instead, it can appear anywhere in your document. The <iframe> tag defines a rectangular region within the document in which the browser can display a separate document, including scrollbars and borders. An inline frame is used to embed another document within the current HTML document.

The src attribute is used to specify the URL of the document that occupies the inline frame.


iframes
iframe 

frame Syntax
An HTML iframe is defined with the <iframe> tag:

<iframe src="URL"></iframe> The src attribute specifies the URL (web address) of the inline frame page. Iframe - Set Height and Width Use the height and width attributes to specify the size of the iframe. The attribute values are specified in pixels by default, but they can also be in percent (like "80%"). Example <iframe src="demo_iframe.htm" height="200" width="300"></iframe> Or you can use CSS to set the height and width of the iframe: Example <iframe src="demo_iframe.htm" style="height:200px;width:300px;"></iframe> Iframe - Remove the Border By default, an iframe has a border around it. To remove the border, add the style attribute and use the CSS border property: Example <iframe src="demo_iframe.htm" style="border:none;"></iframe> With CSS, you can also change the size, style and color of the iframe's border: Example <iframe src="demo_iframe.htm" style="border:2px solid red;"></iframe> Iframe - Target for a Link An iframe can be used as the target frame for a link. The target attribute of the link must refer to the name attribute of the iframe: Example <iframe src="demo_iframe.htm" name="iframe_a"></iframe> <p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p> HTML iframe Tag Tag Description <iframe> Defines an inline frame


<iframe src="URL"></iframe>
The src attribute specifies the URL (web address) of the inline frame page.

Iframe - Set Height and Width
Use the height and width attributes to specify the size of the iframe.


The attribute values are specified in pixels by default, but they can also be in percent (like "80%").

Example
<iframe src="demo_iframe.htm" height="200" width="300"></iframe>
Or you can use CSS to set the height and width of the iframe:

Example
<iframe src="demo_iframe.htm" style="height:200px;width:300px;"></iframe>
Iframe - Remove the Border
By default, an iframe has a border around it.


To remove the border, add the style attribute and use the CSS border property:

Example
<iframe src="demo_iframe.htm" style="border:none;"></iframe>
With CSS, you can also change the size, style and color of the iframe's border:

Example
<iframe src="demo_iframe.htm" style="border:2px solid red;"></iframe>
Iframe - Target for a Link
An iframe can be used as the target frame for a link.

The target attribute of the link must refer to the name attribute of the iframe:

Example
<iframe src="demo_iframe.htm" name="iframe_a"></iframe>

<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>
HTML iframe Tag
Tag Description
<iframe> Defines an inline frame



-:Example:-


<!DOCTYPE html>
<html>

   <head>
      <title>HTML Iframes</title>
   </head>
   <body>
      <p>Document content goes here...</p>
      
      <iframe src = "/html/menu.htm" width = "555" height = "200">
         Sorry, your browser does not support inline frames.
      </iframe>
      
      <p>Document content also go here...</p>
   </body>
</html>

Tags
Reactions

Post a Comment

0 Comments