0% found this document useful (0 votes)
235 views5 pages

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
0% found this document useful (0 votes)
235 views5 pages

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

 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="[Link] target="iframe_a">[Link]</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 [Link]
<iframe ="[Link]

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