The iframe tag

The iframe tag allows you to embed content from one website into another. It is used to display content such as videos, images, or articles without having to open a new window or tab.

The content of the inserted site will have the design of this site. At the same time, the CSS styles of our site, as well as our JavaScript code, will not affect the content of the iframe tag.

You can apply our JavaScript to the contents of iframe, but you need to use special methods to do so.

The iframe tag is widely used on websites to embed videos from YouTube and other platforms, as well as to display articles and images from other sources.

Attributes

Attribute	Description
`src`	Specifies the address of the page to be embedded.
`srcdoc`	Allows you to specify the contents of the iframe directly in the attribute.
`frameborder`	Specifies the focus frame of the iframe. The value `yes` specifies a border (the default), and the value `no` removes the border.
`scrolling`	Specifies scrollbars within an iframe. The value `auto` means scrolling when needed (default), the value `yes` means scrolling always, the value `no` means no scrolling.

Example

Let's insert an iframe with another site into our site (let's take code.mu as an example):

<iframe src="https://code.mu/" width="600" height="400"></iframe>

Example

Let's embed a video from YouTube on our website:

<iframe
	src="https://www.youtube.com/embed/KzQrHpB1H8U"
	allowfullscreen
	width="400"
	height="400">
</iframe>

Example

Let's write the content directly in the iframe:

<iframe
	srcdoc="<h1>head</h1><p>text</p>"
	width="300"
	height="200">
</iframe>