Purpose and content model
Iframe creates a nested browsing context with its own document. It can embed a page or an inline srcdoc document, but it also introduces performance, privacy, and security considerations. Treat embedded content according to who controls it. A third-party player, a trusted internal report, and arbitrary learner code require different permissions.
Iframe has a closing tag but is not a normal container for visible fallback children. Use surrounding prose and links for alternatives. The same-origin policy restricts script access across origins, while sandbox can impose additional restrictions even on content whose URL would otherwise be trusted.
Syntax and working example
<iframe src="/maps/accessible-map.html" title="Map showing the library entrance"
width="640" height="360" loading="lazy" referrerpolicy="no-referrer"></iframe>
<p><a href="/directions/">Read written directions</a>.</p>Supported attributes and behavior
Src chooses a URL and srcdoc supplies inline HTML, taking precedence when used. Title names the frame; name can serve as a navigation target. Width, height, loading, referrerpolicy, sandbox, and allow control presentation, fetching, and permissions. Allow uses Permissions Policy syntax. Sandbox starts restrictive and individual tokens lift restrictions. Combining allow-scripts and allow-same-origin for untrusted same-origin content can undermine the intended isolation.
Another practical pattern
<iframe title="Isolated greeting" sandbox="allow-scripts"
srcdoc="<h1>Hello</h1><script>document.body.dataset.ready=1</script>"></iframe>Accessibility and browser notes
A concise title helps users distinguish embedded documents. Include a usable alternative when the embed is not essential. Avoid keyboard traps and unexpected focus changes. Permissions Policy does not grant a permission by itself; browser permission and secure-context rules may also apply.
Common mistakes
Do not assume a hidden iframe is harmless or that sandbox protects against every resource-exhaustion issue. Do not grant navigation, downloads, forms, popups, or same-origin access without a concrete need. Escape srcdoc correctly when it is placed inside an HTML attribute.
Verify your implementation
Test parent-DOM access, network requests, top navigation, popups, and forms according to your threat model. Confirm that denied actions actually fail in your target browsers. Review the frame's network behavior and keyboard entry and exit paths before deploying an embed.
Standard status and sources
Standard; browser availability must be checked independently of specification status.