De iframe-tag
De tag iframe maakt het mogelijk om inhoud van de ene website in een andere in te sluiten. Hij wordt gebruikt om content weer te geven, zoals video's, afbeeldingen of artikelen, zonder dat er een nieuw venster of tabblad geopend hoeft te worden.
De inhoud van de ingesloten website zal het
ontwerp van die specifieke website hebben. De CSS-stijlen
van onze website, evenals onze JavaScript-code,
zullen geen invloed hebben op de inhoud van de iframe-tag.
Er kan JavaScript op de inhoud van de iframe worden toegepast,
maar hiervoor moeten speciale methoden worden gebruikt.
De tag iframe wordt veel gebruikt op websites om video's van YouTube en andere platforms in te sluiten, evenals om artikelen en afbeeldingen van andere bronnen weer te geven.
Attributen
| Attribuut | Beschrijving |
|---|---|
src |
Geeft het adres aan van de pagina die moet worden ingesloten. |
srcdoc |
Maakt het mogelijk om de inhoud van de iframe rechtstreeks in het attribuut in te stellen. |
frameborder |
Stelt een rand rond de iframe in.
De waarde yes geeft een rand (standaard),
en de waarde no verwijdert de rand.
|
scrolling |
Bepaalt de schuifbalken binnen de iframe.
Waarde auto - scrollen indien nodig (standaard),
waarde yes - altijd scrollen,
waarde no - geen scrollen.
|
Voorbeeld
Laten we een iframe met een andere website op onze site plaatsen (we nemen code.mu als voorbeeld):
<iframe src="https://code.mu/" width="600" height="400"></iframe>
:
Voorbeeld
Laten we een video van YouTube op onze site insluiten:
<iframe
src="https://www.youtube.com/embed/KzQrHpB1H8U"
allowfullscreen
width="400"
height="400">
</iframe>
:
Voorbeeld
Laten we de inhoud rechtstreeks in de iframe schrijven:
<iframe
srcdoc="<h1>head</h1><p>text</p>"
width="300"
height="200">
</iframe>
: