Den HTML-Code für einen unsichtbaren Hintergrund auf iFrames

Ein Iframe — oder Inlineframe — ist ein Element innerhalb einer Seite mit einer anderen Seite. Der Rahmen ist eine einfache Möglichkeit, ein kleines, leicht kontrolliertes Element auf einer Webseite zu erstellen, unter Beibehaltung des Inhalts in einer anderen Datei. IFrames werden in den meisten gängigen Browsern, wie Internet Explorer, Firefox, Safari und Chrome unterstützt.

Iframe-Transparenz

Ein Iframe ist standardmäßig transparent — es hat keinen Hintergrund eigener, sondern den Hintergrund der Inhaltsquelle verwendet. So lange die Seite als Quelle verwendet keine definierte Hintergrundfarbe oder ein Bild haben, sollten Sie nur Text und Bilder über der Hauptseite Hintergrundbild oder Farbe sehen. Wenn Sie ein Stylesheet mit vordefinierte Hintergrundfarben auf Ihren Content-Quelle verwenden, sollten Sie die entfernen, das sein mag, warum Ihre Iframe transparent ist nicht.

Einrichten des Bilderrahmens

Iframe-Einrichtung ist relativ einfach; Sie müssen nur die Höhe und Breite des Rahmens und die Quelle des Inhalts zu definieren. Sie können jede Datei in Ihrem Web-Space, einschließlich HTML, TXT und PHP-Dateien verwenden. Zwischen dem öffnenden und schließenden Tags Sie irgendeine Nachricht einschließen sollte erscheint die, wenn der Browser eines Benutzers nicht Iframe-Unterstützung. Ihre einfachen, transparenten 300 Pixel quadratisch Iframe würde Wasserverbrauch codiert werden:

< Iframe Src = "http://www.yourdomain.com/iframecontent.html & Quot; Width = "300" Height = "300" >< p > konnte dieses Iframe nicht ordnungsgemäß in Ihrem Browser. </p > anzeigen< / Iframe >

Nahtlose Iframes

Iframe hat einen Rahmen automatisch, die jeden Sinn für nahtlosen, die Transparenz bietet entfernt. Dies kann leicht genug entfernt werden, indem mithilfe des Attributs "Frameborder" und es auf 0 (null). Zum Beispiel:

< Iframe Src = "http://www.yourdomain.com/iframecontent.html & Quot; Width = "300" Height = "300" Frameborder = "0" >< p > konnte dieses Iframe nicht ordnungsgemäß in Ihrem Browser. </p > anzeigen< / Iframe >

Wenn Sie, verwenden Sie die Grenze möchten wieder, können Sie entweder dieses Element zu entfernen oder ändern die NULL zu einer. Sie können auch geändert und die Grenze mit CSS zu steuern. Wenn Sie einen durchgehenden schwarzen 3-Pixel-Rahmen hinzufügen wollten, würde es so aussehen:

< Iframe Src = "http://www.yourdomain.com/iframecontent.html & Quot; Width = "300" Height = "300" Style = "Border: 3px solid #000000;" >< p > konnte dieses Iframe nicht ordnungsgemäß in Ihrem Browser. </p > anzeigen< / Iframe >

Hintergrund-Ideen

Wollen Sie Ihren Iframe und Hauptseite Hintergrund passen, prüfen Sie mit der gleichen Farbe auf beiden; Verwenden eines Bilds ist riskant, wie die Chancen stehen gut, dass das Bild zwischen der Seite und den Iframe-Hintergrund falsch wäre. Auch können CSS Sie zu einen Iframe transparent machen so dass auch mit einem anderen Hintergrund innerhalb des Frames noch ein Element der Mischung hinzufügen können. Ein Iframe, der 25 % transparent mit weißem Hintergrund und schwarzer Rand ist würde wie folgt aussehen:

< Iframe Src = "http://www.yourdomain.com/iframecontent.html & Quot; Width = "300" Height = "300" Style = "Border: 3px solid #000000;opacity:0.75;filter:alpha(opacity=75);" >< p > konnte dieses Iframe nicht ordnungsgemäß in Ihrem Browser. </p > anzeigen< / Iframe >

Das "Filter"-Attribut ist für Internet Explorer erforderlich, während "Deckkraft" für andere Browser funktioniert.