Tutorials Tonight's Logo

HTML IFRAME


HTML iframe also known as inline frame is used to display external objects or a webpage inside a web page.

Syntax of iframe

To define an inline frame we use HTML <iframe> tag.

<iframe src="#url"></iframe>

The src attribute is used to provide the address of a webpage or any external object.



Height and width of iframe

The height and width of an iframe can be specified using height and width attribute.

<iframe src="example-iframe.htm" height="220px" width="100%"></iframe>
▶ Run the code

We can specify height and width either in percentage value or in pixel value.

Output:



iframe border removing

The frameborder attribute specifies border in iframe. It has two values 1 and 0. The default value is 1 which creates a border for removing borders. we can specify frameborder="0".

<iframe src="https://www.tutorialstonight.com" height="220px" width="100%" frameborder="0"></iframe>
▶ Run the code

Output:


iframe as link target

An iframe can be used as target for any link

To use an iframe by any hyperlink it must have a target attribute specified to the name attribute of the iframe.

<iframe src="example-iframe.htm" height="220px" width="100%" name="my_iframe"></iframe>
<p><a href="https://www.tutorialstonight.com" target="my_iframe">click here</a> to open homepage in above iframe.</p>
▶ Run the code

Output:

click here to open homepage in above iframe.


Follow Us

Copyright © Tutorials Tonight. All Rights Are Reserved.