A preview frame starts as an empty embedded document, receives an accessible title, then renders inline srcdoc content.

Program

Iframes embed a separate document inside the current page. The title describes the frame, and srcdoc can provide inline HTML for static examples.

iframe_srcdoc_title.html
Visuals: captured from real browser rendering
<iframe title="Schedule preview" srcdoc="&lt;h1&gt;Day 1&lt;/h1&gt;&lt;p&gt;Setup lab&lt;/p&gt;"></iframe>
  1. Create an embedded document frame.

    An empty embedded frame appears inside the page.
    The iframe reserves space for another document.
  2. Name the embedded frame.

    The frame looks the same, but its accessible name is Schedule preview.
    The title tells readers what the embedded document contains.
  3. Render the inline document.

    The frame displays a Day 1 heading and Setup lab text.
    The srcdoc attribute gives the iframe its own HTML content.
iframe An iframe creates a nested browsing context inside the page.
srcdoc The srcdoc attribute supplies inline HTML for the embedded document.