Home >>HTML Tutorial >HTML Iframes
HTML Iframes
HTML Iframes
An iframe in HTML is used to display an inline frame. It helps to nested a webpage within a webpage. It provides scrollbars and borders in which a separate document is displayed by the browser. The 'iframe' tag is used to embeds another documents within the current HTML document.
To embed the webpage you need ‘src’ attribute to specify the URL of the new document.
Syntax: <iframe src="URL"></iframe>
Setting Height and Width in Iframe
To specify the height and width of the iframe you can use height and width attributes. By default the height and width are specified in pixels.
Let's take an example of height and width of iframe:
<!DOCTYPE html> <html> <body> <h2>Set the height and width of Iframes</h2> <iframe src="https://www.phptpoint.com" height="200" width="400"></iframe> </body> </html>
Set the height and width of Iframes
Iframe –Removing the border
By default an Iframe consist border around it. To remove the border you need to add style and use the CSS border property.
Let's take an example of removing the border in Iframe:
<!DOCTYPE html> <html> <body> <h2>Remove the border in Iframes</h2> <iframe src="https://www.phptpoint.com" height="200" width="400" style="border:none;"></iframe> </body> </html>
Remove the border in Iframes
Iframe –Target for a link
You can use the iframe as the target frame for a link. The target attribute of the link must refer to the name attribute of the iframe.
Let's take an example of target link:
<!DOCTYPE html> <html> <body> <h2>Target the link</h2> <iframe src="https://www.phptpoint.com" height="200" width="400" style="border:none;"></iframe> <p><a href="https://www.phptpoint.com" target="iframe_a">phptpoint.com</a></p> </body> </html>