Az iframe tag

A iframe tag lehetővé teszi egy weboldal tartalmának beágyazását egy másikba. Olyan tartalom megjelenítésére használják, mint videó, kép vagy cikk, anélkül, hogy új ablakot vagy lapot kellene megnyitni.

A beágyazott weboldal tartalma annak a weboldalnak a designjával fog megjelenni. Eközben a mi weboldalunk CSS stílusai, valamint a JavaScript kódunk nem lesz hatással a iframe tag tartalmára.

A iframe tartalmára alkalmazhatjuk a JavaScriptünket, de ehhez speciális módszerekkel kell eljárnunk.

A iframe tag széles körben használatos weboldalakon YouTube-ról és más platformokról származó videók beágyazására, valamint más forrásokból származó cikkek és képek megjelenítésére.

Attribútumok

Attribútum	Leírás
`src`	Megadja annak az oldalnak a címét, amelyet be kell ágyazni.
`srcdoc`	Lehetővé teszi az iframe tartalmának közvetlen megadását az attribútumban.
`frameborder`	Keretet állít be az iframe körül. A `yes` érték beállít egy keretet (alapértelmezés), a `no` érték pedig eltávolítja a keretet.
`scrolling`	Beállítja a görgetősávokat az iframe-en belül. A `auto` érték - görgetés szükség esetén (alapértelmezés), a `yes` érték - görgetés mindig, a `no` érték - nincs görgetés.

Példa

Helyezzünk el a weboldalunkon egy iframe-et egy másik weboldallal (példaként vegyük a -t):

html<iframe src="/" width="600" height="400"></iframe>

Результат:

Példa

Helyezzünk el a weboldalunkon egy YouTube videót:

html<iframe
  src="https://www.youtube.com/embed/KzQrHpB1H8U"
  allowfullscreen
  width="400"
  height="400">
</iframe>

Результат:

Példa

Írjuk meg a tartalmat közvetlenül az iframe-ben:

html<iframe
  srcdoc="<h1>cím</h1><p>szöveg</p>"
  width="300"
  height="200">
</iframe>

Результат: