Wie und wann werden Iframes (Inline-Frames) verwendet?

Inline-Frames, die im Allgemeinen nur als "iframes" bezeichnet werden, sind der einzige in Frames in HTML5 zulässige Frametyp. Diese Frames sind im Wesentlichen ein Abschnitt Ihrer Seite, den Sie "ausschneiden". In dem Bereich, den Sie aus der Seite ausgeschnitten haben, können Sie dann eine externe Webseite hinzufügen. Im Grunde ist ein iframe ein weiteres Browserfenster direkt in Ihrer Webseite. Sie codieren häufig verwendete Frames auf Websites, die externe Inhalte wie eine Google-Karte oder ein Video von YouTube enthalten müssen. Beide populären Websites verwenden iframes in ihrem Einbettungscode.

So verwenden Sie das IFRAME-Element

Das Element verwendet die globalen HTML5-Elemente sowie mehrere andere Elemente. Vier sind auch Attribute in HTML 4.01:

• -Die URL für die Quelle des Frames
• - die Höhe des Fensters
• - die Breite des Fensters
• - der Name des Fensters

Und drei sind neu in HTML5:

• srcdoc- der HTML-Code für die Quelle des Frames. Dieses Attribut hat Vorrang vor allen URLs in src Attribut
• Sandkasten- Eine Liste von Funktionen, die im Rahmenfenster zulässig oder nicht zulässig sein sollen
• nahtlos- teilt dem Benutzeragenten mit, dass der iframe so dargestellt werden sollte, als sei er unsichtbar Teil des übergeordneten Dokuments

Um einen einfachen iframe zu erstellen, legen Sie die Quell-URL sowie Breite und Höhe fest:

Beachten Sie, dass Sie möglicherweise keine Pixelwerte für die Einstellungen Ihres iframe verwenden, sondern stattdessen einen Prozentsatz verwenden möchten. Wenn Sie eine responsive Website erstellen, deren Größe sich bei verschiedenen Bildschirmgrößen ändern sollte, sind diese Prozentsätze wichtig.

Es gibt auch einige Attribute, die in HTML 4.01 gültig sind, aber in HTML5 veraltet sind. Da die meisten Websites heutzutage HTML5 + verwenden, sollten Sie diese Attribute nicht verwenden (die Sie jedoch in einigen älteren Dokumenten finden können).

• - Verwenden Sie stattdessen eine EIN Element, das mit einer Beschreibung verknüpft werden soll
• Verwenden Sie stattdessen CSS schweben Eigentum
• Transparenz zulassenVerwenden Sie stattdessen CSS Hintergrund Eigenschaft, um das ifram transparent zu machen
• Verwenden Sie stattdessen die Rand CSS-Eigenschaft
• RandhöheVerwenden Sie stattdessen CSS Spanne Eigentum
• RandbreiteVerwenden Sie stattdessen CSS Spanne Eigentum
• Verwenden Sie stattdessen CSS Überlauf Eigentum

IFRAME Browser-Unterstützung

Das IFRAME Element wird von allen modernen Browsern unterstützt:

• Android
• Chrom
• Feuerfuchs
• Internet Explorer 2+
• iOS / Safari Mobile
• Netscape 7+
• Opera 3+
• Safari

Wenn in der obigen Liste keine Versionsnummer angezeigt wird, wird dies von allen Browser-Versionen unterstützt.

Dabei ist zu beachten, dass alle Browser das unterstützen IFRAME Für einige der HTML5-Funktionen gibt es noch eine begrenzte Unterstützung.

• Verwenden Überlauf das Scrollen zu deaktivieren ist nicht zuverlässig. Wenn Sie keine Bildlaufleisten in Ihren iframes haben möchten, sollten Sie weiterhin die Scrollen Attribut.
• Das srcdoc, Sandkasten, und nahtlos Attribute werden derzeit von keinem Browser unterstützt.

Verlinkung mit Iframes

Wenn Sie Ihren iframes einen geben Name oder Ich würde Sie können dann Ihre Links auf diesen Frame mit dem Attribut auf zeigen EIN Element. Wenn ein Benutzer dann auf den Link klickt, wird er in dem referenzierten Iframe und nicht im aktuellen Fenster geöffnet.

Versuch es selber. Geben Sie Folgendes in eine Webseite ein:

id = "myIframe" src = "http://webdesign.about.com/#lp-main" height = "200px" width = "500px">

Das ist mein iframe

Wenn Sie auf diesen Link klicken, wird ein neues Dokument im obigen Fenster geöffnet.

Wenn das Dokument im geöffnet wurde IFRAME Wenn keine Ziele festgelegt sind, werden alle diese Links in demselben iframe wie das übergeordnete Dokument geöffnet.

Sie können diese Funktion verwenden, um Links zu erstellen IFRAME den Inhalt eines anderen ändern IFRAME auf der selben Seite.

IFrames und Sicherheit

Das IFRAME Element an sich ist kein Sicherheitsrisiko für Sie oder Ihre Leser. Leider haben Iframes einen schlechten Ruf, weil sie von bösartigen Websites dazu verwendet werden können, Inhalte aufzunehmen, die den Computer eines Besuchers infizieren können, ohne dass er auf der Seite angezeigt wird. Dies geschieht, indem Links auf das Unsichtbare zeigen IFRAME und diese Skripte setzen schädlichen Code aus. Der Benutzer klickt auf den Link und glaubt, dass der Link unterbrochen wurde, da scheinbar nichts passiert ist. Ein Skript wurde jedoch dort abgesetzt, wo es nicht sichtbar war.

Es gibt auch Computerviren, die ein Unsichtbares injizieren IFRAME in Ihre Webseiten, um Ihre Website effektiv in ein Botnetz zu verwandeln. Sie können dies durch SQL-Injection und andere Angriffe tun.

Die Sache, die man sich merken sollte, wenn man IFRAME auf Ihrer Webseite ist, dass Ihre Benutzer nur so sicher sind wie der Inhalt aller Websites, zu denen Sie einen Link erstellen. Wenn Sie Grund zu der Annahme haben, dass eine Website nicht vertrauenswürdig ist, verlinken Sie sie in keiner Weise und nehmen Sie auf keinen Fall den Inhalt dieser Website auf IFRAME. Das Verlinken auf Ihre eigenen Seiten innerhalb von iframes stellt jedoch kein Sicherheitsrisiko für Sie oder Ihre Benutzer dar.

Originalartikel von Jennifer Krynin. Bearbeitet am 11.7.16 von Jeremy Girard