Wulin.com (www.vevb.com) Artikel Einführung: Modernizr und HTML5.
OK, HTML5 ist jetzt beliebt, also werde ich HTML5 zu seinem Titel hinzufügen :)
Tatsächlich wird Modernizr für HTML5 geboren - es ist eine JS -Bibliothek, die die Unterstützung der Browser für HTML5- und CSS3 -Funktionen erkennt. Die berühmte HTML5/CSS3 -Browser -Kompatibilitäts -Website Findmebyip basiert auf diesem Framework.
Sie können sehen, dass es einen Link zu Modernizr auf der grünen Taste in der unteren rechten Ecke gibt.
Merkmale von ModernizrDie Funktion von Modernizr ist eigentlich sehr einfach. Es soll JS verwenden, um die Unterstützung des Browsers für HTML5/CSS3 -Funktionen zu erkennen. Wenn es ein bestimmtes Attribut unterstützt, fügen Sie dem <html> Tag der Seite eine entsprechende Klasse hinzu. Wenn es nicht unterstützt wird, fügen Sie eine No-Refix-Klasse hinzu. Wenn der erkannte Browser beispielsweise das Video-Tag unterstützt, fügt Modernizr dem <html> -Tag eine Videoklasse hinzu, andernfalls fügen Sie eine No-Video-Klasse hinzu.
Überprüfen Sie den Quellcode von Findmebyip oder verwenden Sie ein Tool wie Firebug, um den Seitencode anzuzeigen, und Sie können die Klasse im <html> -Tag sehen.
Darüber hinaus bietet Modernizr auch eine weitere Verwendung, bei der die Unterstützung des Browsers für eine bestimmte Funktion allein erfasst wird, z. B.:
Es ist relativ sicher, die Unterstützung des Browsers für HTML5 durch ähnliche Schnittstellen zu erkennen.
Browsererkennung: UA VS -FunktionenIn der Tat nutzt normalerweise jeder UA, um einen Browser zu erkennen. Natürlich liefert UA auch umfangreichere Informationen. UA ist nicht allmächtig und hat auch einige Schwächen, wie die UA -Verkleidung des Browsers des Benutzers, und das Fehlen von UA -Informationen, die von einigen Rückwärtsbrowsern bereitgestellt werden, wirkt sich auf das Urteil über Browserinformationen aus. Noch wichtiger ist, dass bei HTML5 -Funktionen UA verwendet, um festzustellen, ob ein Browser eine bestimmte Funktion unterstützt, zu komplex und unzuverlässig ist.
Natürlich gab es immer Debatten über UA und Feature -Erkennung. Was ich hier sagen möchte, ist, dass eine spezifische Analyse spezifischer Probleme mithilfe von HTML5 zur Erkennung von Funktionsunterstützung auf der Website zuverlässiger und bequemer ist als Ua ~~
Mit modernizrDie Verwendung von Modernizr ist sehr einfach. Stellen Sie einfach die JS -Datei der Bibliothek in die Seite ein:
>/script>
Modernizr ist Open Source, aber aus irgendeinem Grund wurde es von G-FW blockiert.
Modernizr @ gitDas Modernizr -Projekt wird in Git gehostet. Sie können es unter der folgenden Adresse erhalten:
Der Autor bietet auch eine einfache Ausgabeseite in Git:
Und eine detaillierte Testseite:
Verlängerte Lesung:Erkennen von HTML5 -Funktionen
HTML5 und CSS3 sicher mit Modernizr einsetzen