References

Beginner-friendly references for web development, with live, editable examples.

The HTML srcdoc attribute

Attribute All modern browsers Updated
Quick answer

The HTML srcdoc attribute provides the HTML content of the iframe inline, instead of loading a URL. It is used on the <iframe> element.

Overview

The srcdoc attribute supplies inline HTML for an iframe. It is used on the <iframe>, <object> and <embed> elements.

It configures embedded content — what is embedded, what capabilities it is granted, and how it is sandboxed. With third-party content, these attributes are your main security controls.

Syntax

<iframe srcdoc="&lt;p&gt;Hello&lt;/p&gt;"></iframe>

Values

Value
A string of HTML.

Best practices

  • Give every <iframe> a descriptive title.
  • Sandbox untrusted content with sandbox, and avoid combining allow-scripts with allow-same-origin for untrusted sources.
  • Grant only the features a frame needs with the allow attribute.
  • Defer off-screen frames with loading="lazy".

Frequently asked questions

What does the srcdoc attribute do?
Supplies inline HTML for an iframe.
How do I make an iframe secure?
Restrict untrusted content with sandbox, grant minimal features with allow, and never pair allow-scripts with allow-same-origin for untrusted sources.
How do I embed inline HTML in an iframe?
Use the srcdoc attribute to supply the HTML directly instead of a src URL.
Which elements use the srcdoc attribute?
It is an element-specific attribute, used on the <iframe>, <object> and <embed> elements.
src srclang