00:00:00

<iframe> tag in HTML5

The <iframe> tag in HTML5 is used to embed content from another source, such as a web page, into a HTML document. This allows you to include external content, such as videos, maps, and forms, directly within your HTML document without having to reload the entire page.

Here's a basic example of how to use the <iframe> tag:

<iframe src="https://www.example.com/embedded-content" width="500" height="300"></iframe>

In this example, the src attribute specifies the URL of the content that you want to embed, and the width and height attributes specify the size of the <iframe> element.

Here are some of the most commonly used <iframe> tag attributes:

  1. src: Specifies the URL of the content that you want to embed.

  2. width and height: Specify the size of the <iframe> element in pixels.

  3. frameborder: Specifies the width of the border around the <iframe> element. The default value is "0".

  4. scrolling: Specifies whether the content within the <iframe> element should have a scrollbar. The default value is "auto".

  5. name: Specifies a name for the <iframe> element, which can be used to target the embedded content with JavaScript.

  6. sandbox: Specifies a list of permissions for the embedded content. For example, you can use the sandbox attribute to prevent the embedded content from accessing the parent document or from running scripts.

  7. allowfullscreen: Specifies whether the embedded content can be displayed in fullscreen mode.

It's important to note that the content within an <iframe> element is considered to be a separate document from the parent document. This means that the embedded content is subject to the same-origin policy, which restricts access to resources based on the origin of the document. To allow access to resources from different origins, you can use the sandbox attribute or the postMessage API.

In conclusion, the <iframe> tag in HTML5 provides a powerful and flexible way to embed external content into your HTML document, making it an essential tool for web development.