Hello, world!

iframes HTML

The HTML tutorial illustrates how to apply iframes and its set height and width, remove the border, modify the size, style and color of the Border, use it as a target for a link.



HTML Iframes

You can specify an inline frame through the HTML attribute <iframe>.
The HTML Inline Frame Element (<iframe>) displays a HTML page loading another HTML page into the existing page.

Syntax iframes:

<iframe src="URL"></iframe>


HTML code example iframes:

<!DOCTYPE html>
<html>
<head>
<title>How to create HTML Iframes</title>
</head>
<body>
<p>Put text here...</p>
<iframe src="/html/menu.htm" width="400" height="150">
  </iframe>
<p>Put text here...</p>
</body>
</html>


HTML output iframes:

How to create HTML Iframes

Put text here...

Put text here...


Set Height and Width

You can indicate the size of the height and width of the Iframe in pixels or as a percentage.

HTML code example set height and width:

<!DOCTYPE html>
<html>
<head>
<title>How to set HTML Iframes height and width</title>
</head>
<body>
<p>How to set HTML Iframes height and width</p>
<iframe src="/html/menu.htm" width="400" height150">
</iframe>
</body>
</html>

HTML output set height and width:

How to set HTML Iframes height and width

How to set HTML Iframes height and width



Remove the Border

The iframe default border can be removed by adding style attribute and set the CSS border property.

HTML code example remove the border:

<!DOCTYPE html>
<html>
<head>
<title>How to remove HTML Iframes border</title>
</head>
<body>
<p>How to remove HTML Iframes border</p>
<iframe src="/html/menu.htm" style="border:none">
</body>
</html>


HTML output remove the border:

How to remove HTML Iframes border

How to remove HTML Iframes border