Scribd
Upload
72 views

HTML Iframes

Uploaded by

RamanKumarJha
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
72 views

HTML Iframes

Uploaded by

RamanKumarJha
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 5

 Menu  Log in

Dark mode
Dark code
  HTML CSS   

Ads by
Stop seeing this ad Why this ad?

HTML Iframes
❮ Previous Next ❯

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

 Tutorials  References  Exercises  Menu 

Log in

Sign Up Upgrade Get Certified Create Website


Dark mode
Dark code
  HTML CSS JAVASCRIPT   

HTML Iframe Syntax


The HTML <iframe> tag specifies an inline frame.

An inline frame is used to embed another document within the current HTML
document.
Syntax
<iframe src="url" title="description"></iframe>

Tip: It is a good practice to always include a title attribute for the <iframe> . This
is used by screen readers to read out what the content of the iframe is.

Iframe - Set Height and Width


Use the height and width attributes to specify the size of the iframe.

The height and width are specified in pixels by default:

Example

<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe


Example"></iframe>

Try it Yourself »

Or you can add the style attribute and use the CSS height and width properties:

Example

<iframe src="demo_iframe.htm" style="height:200px;width:300px;"


title="Iframe Example"></iframe>

Try it Yourself »

ADVERTISEMENT
Ads by
Stop seeing this ad Why this ad?

S H O P P I N G D AY S

OFFERS END
SOON

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;" title="Iframe Example">


</iframe>

Try it Yourself »

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;" title="Iframe


Example"></iframe>

Try it Yourself »
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" title="Iframe Example">


</iframe>

<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a>


</p>

Try it Yourself »

Chapter Summary
The HTML <iframe> tag specifies an inline frame
The src attribute defines the URL of the page to embed
Always include a title attribute (for screen readers)
The height and width attributes specify the size of the iframe
Use border:none; to remove the border around the iframe

HTML Exercises

Test Yourself With Exercises

Exercise:
Create an iframe with a URL address that goes to https://www.w3schools.com.
<iframe ="https://www.w3schools.com"></iframe>

Submit Answer »

Start the Exercise

HTML iframe Tag


Tag Description

<iframe> Defines an inline frame

For a complete list of all available HTML tags, visit our HTML Tag Reference.

❮ Previous Next ❯

ADVERTISEMENT

You might also like