Schließlich ist die HTML5 -Spezifikation eine gerade definierte Spezifikation, und einige Browser können die neuen Labels und neuen Attribute, insbesondere die IE8 und die folgenden Versionen des Browsers, nicht unterstützen. Hier sind einige praktische Methoden, die die neuen Tags von HTML5 auf der Seite verwenden.
IE8 Browser hat keine neue Unterstützung für HTML5 -Tags hinzugefügt, sodass der Inhalt im neuen HTML5 -Tag in IE8 nicht direkt angezeigt wird. Glücklicherweise unterstützt der IE8/IE7/IE6 das vom Dokument generierte Etikett.
var e = abbr, article, beiseite, audio, leinwand, datalist, details, dialog, eventsource, figure, footel, hgroup, mark, mess, messgerecht, progess, abschnitt, Zeit, Video.Split (','); Var i = E.Length;Nachdem der Browser das neue Etikett unterstützt, müssen Sie den Standardstil des Etiketts hinzufügen:
ARTIKEL, ABSCHNITT, FIGKAPTION, Abbildung, Fußzeile, Header, Hgroup, NAV, Abschnitt {Anzeige: Block} Mark {Hintergrund:#ff0;Auf diese Weise können der zwei einfache JavaScript -Code und der CSS -Code die IE8 und die folgende Version des Browsers neue Tags in HTML5 unterstützen. Der beste Weg, um reife Frameworks direkt zu verwenden.
<!-[Wenn LT IE 9]> <Script> src = http://html5shim.googlecode.com/svn/trunk/html5.js </script> <[endif]->
HTML5 umfasst im breiten Sinne HTML5, CSS3 und neue APIs. Da die neuen Funktionen mehr oder weniger mit Browsern kompatibel sind, muss festgestellt werden, ob der Browser diese Funktion bei der Verwendung der neuen Funktionen unterstützt. Wenn der Browser keine neuen Funktionen unterstützt, kann er angemessen kompatibel sein. Gegenwärtig gibt es keine einheitliche Methode, um die Unterstützung neuer Funktionen zu erkennen. Glücklicherweise haben im Ausland begeisterte Ingenieure eine Reihe neuer Merkmale der Erkennung entwickelt.
Das Prinzip des ModelNizr -Frameworks besteht darin, automatisch festzustellen, ob der Browser die neuen Funktionen unterstützt und die entsprechende Klasse zum <html> -Tag hinzufügt. Wenn der Browser ein bestimmtes Merkmal unterstützt, wird eine nach dem charakteristische Namen benannte Klasse im Gegenteil hinzugefügt. Gleichzeitig erzeugt es auch ein Objekt namens Modernizr. Das Modernizr -Framework enthält auch die Funktion des HTML5SHIM -Frameworks, mit dem die IE8 und unterhalb der Browser neue Tags unterstützen können.
Die Verwendung von Modernizr ist sehr einfach.
<script src = js/modelnizr.min.js> </script>
Zweitens fügen Sie eine Klasse namens No-Js auf dem HTML-Etikett hinzu:
<html class = no-JS>
Wenn der Browser JavaScript nicht deaktiviert, ersetzt die Klasse auf dem HTML -Tag, nachdem der Browser die Seite geladen hat, dynamisch und addiert. Nach dem Laden ähnelt das HTML -Tag wie folgt:
<html class = js canvas canvasttext geolocation rgba hsla no-multipleBgs borreDerRadius boxShadow opacimanimamns no-csSgra-die nein-csSreflections csstransforms
Im CSS -Code können Sie diese Klassen verwenden, um den Abwärtskompatibilitätscode hinzuzufügen.
#NICE {Hintergrund: URL (Hintergrund-One.png) Oben links Repeat-X;}.}.Leser, die an diesem Rahmen interessiert sind, können die offizielle Website von Modernizr durchsuchen, um immer detailliertere Beispiele und Nutzungsmethoden zu erhalten.
Audio und Videos werden häufig auf der Seite verwendet, Browser sind jedoch verwirrender. Hier finden Sie also ein separates Thema. Audio und Videos sind die Eigenschaften der nativen Unterstützung des Browsers früher, sodass Audio- und Video -Wiedergabe nicht mehr auf die dritte Plugy -Plug -Ins beschränkt ist, insbesondere in mobilen Plattformen. Audio und Videos sind ein großer Kuchen, und alle Browserhersteller möchten das größte unterscheiden, wodurch der Browser auch das Format von Audio- und Videoformaten unterscheidet. Die Liste der unterstützenden Audioformate für den Browser lautet wie folgt:
Browser | Version | Unterstützungsformat |
Internet Explorer | 9.0+ | MP3, AAC |
Chrom | 6.0+ | Ogg Vorbis, MP3, WAV (9,0+) |
Firefox | 3.6+ | Ogg Vorbis, Wav |
Safari | 5.0+ | MP3, AAC, WAV |
Oper | 10.0+ | Ogg Vorbis, Wav |
Etwa 80%des Browsers unterstützt das <udio> Tag von HTML5, aber es gibt kein einheitliches Audio -Format. Aus der Perspektive des Support -Formats können alle Browser auf dem Audioelemente zwei Formate von MP3 und OGG anbieten.
<Audio Controls> <Source Src = Elvis.mp3 type = 'audio/mpeg; Informationen, Download-Links, verwenden Sie Flash Player usw.-> Browser unterstützen <udio </code> Tags </audio> nicht
Das Video ähnelt auch dem Audio.
Browser | Version | Unterstützungsformat |
Internet Explorer | 9.0+ | MP4 |
Chrom | 6.0+ | MP4, Webm, Ogg |
Firefox | 3.6+ | Webm, Ogg |
Safari | 5.0+ | MP4 |
Oper | 10.0+ | Webm, Ogg |
Nach dem vom Browser unterstützten Video -Format zu urteilen, besteht der beste Weg, zwei Formate in WebM- und MP4 -Formaten bereitzustellen. Kompatibler Code ist wie folgt:
<Video Controls> <Source Src = Video.Webm Type = Video/Webm> <Source Src = Video.MP4 Typ = Video/MP4> <! ? R = 0 Frameborder = 0 zulässig
Das obige ist die Browser -Kompatibilitätsversion des neuen Labels von HTML5 von Xiaobian. Ich hoffe, dass es für alle hilfreich ist. Vielen Dank für Ihre Unterstützung für die VEVB Wulin -Website!