HTML <iframe> (Inline Frame) Tag

❮ Previous Reference Next ❯


<iframe src="demo.html" title="demo" width="300" height="600" scrolling="auto">
  Your browser does not support iframe.


<iframe> element specifies a floating frame, an independently controllable content region that can be embedded in a page, making it useful for including remote assets and gadgets.

Note: If a browser doesn't support an <iframe> tag, it displays the text within it.

Version: HTML 4, 5

Standard Syntax

<iframe src="URL" width="pixels" height="pixels" scrolling="auto|no|yes">
Sorry, your browser doesn't support inline frames.

Browser Support



Attribute Value Description
allow - Specifies a feature policy for the <iframe>iframe. The policy defines what features are available to the <iframe> based on the origin of the request. (e.g. access to the microphone, camera, battery etc.).
allowfullscreen true
Specifie the <iframe> can activate fullscreen mode by calling the requestFullscreen() method. This attribute is considered a legacy attribute and redefined as allow="fullscreen".
allowpaymentrequest true
Specifies a cross-origin <iframe> should be allowed to invoke the Payment Request API. This attribute is considered a legacy attribute and redefined as allow="payment".
csp - A Content Security Policy enforced for the embedded resource. See HTMLIFrameElement.csp for details.
fetchpriority high|low|auto Provides a hint of the relative priority to use when fetching the iframe document.
height pixels Specifies the height of the iframe. (default 150 pixels)
loading eager
specifies how the browser should load the iframe.
eager: Load the iframe immediately, regardless if it is outside the visible viewport (this is the default value).
lazy: Defer loading of the iframe until it reaches a calculated distance from the viewport, as defined by the browser.
name name This attribute assigns a name to the floating frame so that it can be the target destination of hyperlinks.
referrerpolicy no-referrer
Specifies which referrer to send when fetching the frame's resource
sandbox allow-forms
Applies extra restrictions to the content in the <iframe>. The value of the attribute can either be empty to apply all restrictions, or space-separated tokens to lift particular restrictions.
src URL This attribute contains the URL of the content to be displayed in the floating frame. If absent, the frame is blank.
srcdoc HTMLCode Inline HTML to embed, overriding the src attribute. If a browser does not support the srcdoc attribute, it will fall back to the URL in the src attribute.
width pixels Specifies the width of the iframe. (default 300 pixels)

Global Attributes

<iframe> element also supports the Global Attributes in HTML.

Event Attributes

<iframe> element also supports the Event Attributes in HTML.

By Default CSS Value(s)

Most of the browsers will display the <iframe> element with the following by default value(s)

iframe {
  display: inline;
  width: 300px;
  height: 150px;

iframe:focus {
  outline: none;

iframe[seamless] {
  display: block;

Related Tags:

<audio>, <embed>, <iframe>, <img>, <map>, <object>, <param>, <picture>, portal>, <source>, <track> and <video>
❮ Previous Reference Next ❯