HTML <iframe> Tag
You may embed another html page into your current page using the iframe tag. This tag is sometimes referred to as the <iframe> element.
An inline frame is a type of frame that allows another page to be embedded into the current HTML text.
Tips: To style the <iframe>, use CSS.
It is best to provide a title property for the <iframe> at all times. Screen readers utilize this to read aloud the contents of the <iframe>.
Syntax
Attributes
| Attribute | Value | Description |
|---|---|---|
| allow | If the <iframe> can enable fullscreen mode by calling the request, this property is set to true. The function Fullscreen() | |
| allowfullscreen |
true
false |
If the <iframe> can initiate fullscreen mode by invoking the request Fullscreen() function, this property is set to true. |
| allowpaymentrequest |
true
false |
If a cross-origin <iframe> should be permitted to use the Payment Request API, set this property to true. |
| height | pixels | The frame's height. Default height is 150 pixels |
| loading |
eager
lazy |
Specifies whether a browser should load an iframe immediately or postpone iframe loading until certain criteria are satisfied. |
| name | text | The element's name. |
| sandbox |
allow-forms
allow-pointer-lock allow-popups allow-same-origin allow-scripts allow-top-navigation |
If the attribute is left empty, limitations will be applied to the frame's content. If the attribute is not an empty string, it will return a list of space-separated tokens of limitations that have been lifted. |
| src | URL | The URL of the page to be embedded. |
| srcdoc | HTML-code | To embed the HTML content of the page (not URL). |
| width | pixels | The frame's width. Default width is 300 pixels |
Supported Browsers
| Element | Chrome | Firefox | Safari | Edge / IE | Opera |
|---|---|---|---|---|---|
| <iframe> | Yes | Yes | Yes | Yes | Yes |