wake-up-neo.net

HTML5 und Frameborder

Ich habe ein iframe in einem HTML5-Dokument. Wenn ich validiere, erhalte ich eine Fehlermeldung, die besagt, dass das Attribut in iframe frameBorder veraltet ist, und dass stattdessen CSS verwendet wird.

Ich habe dieses AttributframeBorder="0"hier, weil es die einzige Möglichkeit war, herauszufinden, wie ich die Grenze in IE loswerden kann. Ich habe border:none; in CSS ohne Glück versucht. Gibt es eine konforme Möglichkeit, dies zu beheben?

Vielen Dank.

cssinternet-explorerhtml5
67
JD Isaacks

HTML 5 unterstützt keine Attribute wie Frameborder, Bildlauf, Randbreite und Randhöhe (die in HTML 4.01 unterstützt wurden). Stattdessen wurde in der HTML 5-Spezifikation das Seamless-Attribut eingeführt. Mit dem Seamless-Attribut wird der Inline-Frame so angezeigt, als würde er als Teil des enthaltenen Dokuments gerendert. Beispielsweise werden Rahmen und Bildlaufleisten nicht angezeigt.

laut MDN

frameborder Veraltet seit HTML5

Der Wert 1 (der Standardwert) zeichnet einen Rahmen um diesen Rahmen. Der Wert 0 entfernt den Rahmen um diesen Rahmen, Sie sollten jedoch stattdessen den CSS-Eigenschaftsrahmen verwenden, um den Rahmen zu steuern.

Wie das obige Zitat besagt, sollten Sie den Rand mit CSS entfernen ;
entweder inline (style="border: none;") oder in Ihrem Stylesheet (iframe { border: none; }).

Davon abgesehen scheint es keinen einzigen iframe-Anbieter zu geben, der frameborder="0" nicht verwendet. Sogar YouTube verwendet das Attribut weiterhin und bietet nicht einmal ein Stilattribut, um iframes abwärtskompatibel zu machen, wenn Frameborder nicht mehr unterstützt wird. Man kann mit Sicherheit sagen, dass das Attribut nicht in Kürze verfügbar ist. So haben Sie 3 Möglichkeiten:

  1. Verwenden Sie weiterhin frameborder, nur um sicherzugehen, dass es (für den Moment) funktioniert.
  2. Verwenden Sie CSS, um das "Richtige" zu tun
  3. Verwende beide. Obwohl dies das Inkompatibilitätsproblem nicht behebt (genau wie Option 1), funktioniert es in jedem Browser, der es war und sein wird


Zum vorherigen Stand dieser jahrzehntealten Antwort:

Das seamless -Attribut wird seit so kurzer Zeit (oder von einigen Browsern überhaupt nicht) unterstützt, dass MDN es nicht einmal als veraltete Funktion auflistet. Verwenden Sie es nicht und lassen Sie sich von den Kommentaren unten nicht verwirren.

40
Sotiris

Wie im anderen Posting here ist es die beste Lösung, den CSS-Eintrag von zu verwenden 

style="border:0;"
45
csharpforevermore

Da das frameBorder-Attribut nur für den IE erforderlich ist, gibt es eine andere Möglichkeit, den Validator zu umgehen. Dies ist eine einfache Methode, die kein Javascript oder DOM-Manipulation erfordert.

<!--[if IE]>
   <iframe src="source" frameBorder="0">?</iframe>
<![endif]-->
<!--[if !IE]>-->
   <iframe src="source" style="border:none">?</iframe>
<!-- <![endif]-->
16
Mr Lister

Das funktioniert

iframe{
    border-width: 0px;
}
6
Harry Bosh

Wie wäre es mit der gleichen Technik für das "Täuschen" des Validators mit Javascript, indem ein Zielattribut in XHTML <a onclick="this.target='_blank'"> eingefügt wird?

  • onsomething = "this.frameborder = '0'"

<iframe onload = " this.frameborder='0' " src="menu.html" id="menu"> </iframe>

Oder getElementsByTagName]("iframe")1 dieses Attribut für alle Iframes auf der Seite hinzufügen?

Ich habe das nicht getestet, weil ich etwas getan habe, was bedeutet, dass nothing in IE weniger als 9! :) arbeitet. :)

2
Harry Alffa

Ich habe eine nette Arbeit gefunden, mit der es in IE7 hier funktionieren kann. Es umgeht den Validator für das frameBorder-Attribut, behält jedoch css für zukünftige Browser bei, wie im Beitrag beschrieben.

0
sareed