Das iframe-Tag

Das Tag iframe ermöglicht es, den Inhalt einer Website in eine andere einzubetten. Es wird verwendet, um Inhalte wie Videos, Bilder oder Artikel anzuzeigen, ohne ein neues Fenster oder einen neuen Tab öffnen zu müssen.

Der Inhalt der eingebetteten Website behält das Design genau dieser Website. Dabei werden die CSS-Stile unserer Website sowie unser JavaScript-Code keinen Einfluss auf den Inhalt des iframe-Tags haben.

Auf den Inhalt des iframe kann unser JavaScript angewendet werden, aber dafür sind besondere Methoden erforderlich.

Das iframe-Tag wird häufig auf Websites verwendet, um Videos von YouTube und anderen Plattformen einzubetten, sowie um Artikel und Bilder aus anderen Quellen anzuzeigen.

Attribute

Attribut	Beschreibung
`src`	Gibt die Adresse der Seite an, die eingebettet werden soll.
`srcdoc`	Ermöglicht es, den Inhalt des Iframes direkt im Attribut festzulegen.
`frameborder`	Legt einen Rahmen um den Iframe fest. Der Wert `yes` setzt einen Rahmen (Standard), und der Wert `no` entfernt den Rahmen.
`scrolling`	Legt die Bildlaufleisten innerhalb des Iframes fest. Der Wert `auto` - Bildlauf bei Bedarf (Standard), der Wert `yes` - Bildlauf immer aktiv, der Wert `no` - kein Bildlauf.

Beispiel

Betten wir auf unserer Website ein Iframe mit einer anderen Website ein (als Beispiel nehmen wir code.mu):

<iframe src="https://code.mu/" width="600" height="400"></iframe>

Beispiel

Betten wir ein Video von YouTube auf unserer Website ein:

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

Beispiel

Schreiben wir den Inhalt direkt in das Iframe:

<iframe
	srcdoc="<h1>head</h1><p>text</p>"
	width="300"
	height="200">
</iframe>