• Tutorial List

HTML iframe

Last updated Jul 08, 2020
HTML iframe, How to set iframe to a link target

The HTML iframe is used to embed a document within a web page. The document can be a webpage, image, media file, PDF, etc.

Syntax:

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

src="URL" – It takes the document address which you want to embed.


Example:

<!DOCTYPE html>
<html>
	<body>

      <iframe src="https://tutorials.w3jar.com/example-web-page/" width="100%" height="400px"></iframe>

	</body>
</html>

The width & height attribute is used to handle the size of the iframe.


How to set iframe to a link target?

If you want to open a link in an iframe, you have to set the link target to the iframe name.

First, you have to specify the iframe name with the help of the name attribute

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

Then put the iframe name in the link target attribute.

<a href="URL" target="myFrame">Click Me</a>

<iframe src="https://tutorials.w3jar.com/wp-content/uploads/mountains.png" name="myFrame" width="100%" height="400px"></iframe>
<br><br>
<a href="https://tutorials.w3jar.com/wp-content/uploads/test.mp4" target="myFrame">Test Video</a>

Ask Questions

Your email address will not be published. Required fields are marked *