HTML & CSS Course
HTML & CSS
/
Intermediate

IFrames

Definition

The `<iframe>` (Inline Frame) element represents a nested browsing context, embedding another HTML page into the current one.

Explain Like I'm New

A window cut into your website that looks out at another website. The website inside the iframe functions completely independently of your main website.

Real World Example

Embedding a YouTube video or a Google Map. YouTube doesn't give you the MP4 file; they give you an `<iframe>` code that loads their custom video player webpage in a small box on your site.

Common Use Cases

  • •Embedding third-party media (YouTube, Spotify)
  • •Embedding external widgets (Maps, Chatbots)

Interactive Example

 Interview Questions
basic
  • What attribute is used to tell the iframe what website to display?
intermediate
  • Can you use JavaScript on your main site to click buttons inside an iframe from another domain?
Flash Cards
Question
What attribute?
Click to reveal answer
Answer
The `src` attribute.
Question
Cross-domain JavaScript control?
Click to reveal answer
Answer
No. This is blocked by the Same-Origin Policy for security. If you embed `bank.com` in an iframe, your JavaScript cannot reach inside the iframe and click 'Transfer Funds'. The browser strictly separates them.