Bitte warten...

HTML: Externe Inhalte einbinden

Die drei hier vorgestellten Elemente können für ähnliche Zwecke verwendet werden, wobei die letztendliche Wahl von der konkreten Anwendung abhängt. <iframe> wird eher zum Einbetten kompletter Webseiten verwendet. <object> und <embed> werden eher zum Einbetten von Multimedia-Inhalten verwendet, wobei <object> flexibler ist und mehr Optionen bietet. Daher ist es vor der Verwendung sinnvoll, zunächst die Spezifikationen dieser Elemente zu studieren.

iframe – Inline-Rahmen

Um ein externes HTML-Dokument einzubinden, steht das Element <iframe> zur Verfügung. Im src-Attribut wird die Quelle des einzubindenden Dokuments angegeben.

Code kopieren
<div class='box'>
  <iframe src='files/Rezepte.pdf'></iframe>
</div>

Dieser Code bewirkt folgende Darstellung:

object – Objekte

In ähnlicher Weise kann das <object>-Element verwendet werden, wobei das referenzierte Objekt hier im Attribut data angegeben wird.

Code kopieren
<div class='box'>
  <object type='application/pdf' data='files/Rezepte.pdf'></object>
</div>

Dieser Code bewirkt folgende Darstellung:

embed – Einbettung

Auch das <embed>-Element kann zu diesem Zweck verwendet werden, wie folgendes Beispiel demonstriert:

Code kopieren
<div class='box'>
  <embed type='application/pdf' src='files/Rezepte.pdf'>
</div>

Dieser Code bewirkt folgende Darstellung: