The HTML iframe element is used to embed another webpage or external content inside the current webpage.
Iframes are commonly used to display videos, maps, dashboards, ads, and third-party widgets.
The iframe Element
The iframe element creates an inline frame that loads content from another source.
The content inside an iframe is independent of the parent page.
In this example:
- iframe defines the embedded frame
- src specifies the URL of the embedded page
The embedded page loads inside the current webpage.
Setting Iframe Size
The width and height attributes control the size of the iframe.
Using the title Attribute
The title attribute provides a description of the iframe content.
It is important for accessibility and screen readers.
Common Uses of Iframes
- Embedding YouTube videos
- Displaying Google Maps
- Integrating payment gateways
- Showing external dashboards
Iframe Limitations and Security
Some websites block iframe embedding for security reasons.
Always embed content only from trusted sources.
Why Iframes Matter for Jobs
Modern websites frequently integrate third-party services using iframes.
Frontend developers are expected to understand iframe usage and limitations.
Practice Task
Embed a website or document using an iframe. Set width, height, and title attributes properly.
What You Will Learn Next
In the next lesson, you will learn how to embed external content like YouTube videos and maps safely.