Array | About | Types | Operations | Dynamic Arrays | Applications | Best Practices and Performance Optimization | Advanced Topics | Conclusion survnor.blogspot.com

About HTML Iframe

The iframe in HTML stands for Inline Frame. The " iframe " tag defines a rectangular region within the document in which the browser can display a separate document.

HTML iframe

An inline frame is used to embed another document within the current HTML document. src is used to speicfy the url of that document.

syntax

<iframe src="url" title="description"></iframe>

Absolute url: It points to another web page. Relative url: It points to other document of same webpage.

Height and Width

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

<h2>Iframes-height &width</h2>

<iframe src="https://google.com/search?igu=1" height="300" width="400" title="Iframe Example"></iframe>

Remove the Border

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

<h2>Iframes-remove the border</h2>

<iframe src="https://google.com/search?igu=1" style="border:none;" height="300" width="400" title="Iframe Example"></iframe>

Sample Output:

Target for a link

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

<h2>Iframes-height &width</h2>

<iframe src="https://google.com/search?igu=1" height="300" width="400" style="border:none" name="iframe_a" title="Iframe Example"></ iframe>

<p><a href="https://google.com" target="iframe_a">google.com</a></p>

Border style

Changing the size, style, and color of the Iframe's border

<h2>Iframes-remove the border</h2> <iframe src="https://google.com/search?igu=1" style="border:4px solid red;" height="300" width="400" title="Iframe Example"></iframe>

Sample Output:

Go to Link