Heim >Web-Frontend >H5-Tutorial >Grundlegende HTML5-Tags (HTML5-Video-Tag, Verwendung neuer HTML5-Tags)_HTML5-Tutorial-Fähigkeiten

Grundlegende HTML5-Tags (HTML5-Video-Tag, Verwendung neuer HTML5-Tags)_HTML5-Tutorial-Fähigkeiten

WBOY
WBOYOriginal
2016-05-16 15:48:252198Durchsuche

1. Änderungen in der Deklaration

2. Geben Sie die Änderung der Zeichenkodierung an, es wird empfohlen, utf-8

in HTML5 zu verwenden

3. Html5 erlaubt

ohne Terminator, was kein Fehler ist

4. End-Tags dürfen nicht geschrieben werden: area, base, br, col, command, embed, hr, img, input, keygen, link, meta, param, source, track, wbr

5. Elemente, bei denen das End-Tag weggelassen werden kann, sind: li, dt, dd, p, rt, rp, optgroup, option, colgroup, thead, tbody, tfoot, tr, td, th

6. Elemente, bei denen alle Tags weggelassen werden können, sind: html, head, body, colgroup, tbody

7. Musste der Attributwerttext in doppelte Anführungszeichen gesetzt werden, kann aber jetzt weggelassen werden

8. Siehe HTML5-Markup-Beispiel

9. Neuer Strukturelementabschnitt: Containerelement. Kapitel, Kopf- und Fußzeilen können in Kombination mit h1, h2... verwendet werden, um die Dokumentstruktur anzuzeigen. Kann auch zum Kapseln von Titelinhalten verwendet werden, aber kein Titel ist unangemessen. Wenn ein Containerelement direkt gestaltet oder mit einem Skript versehen werden muss, um das Verhalten zu definieren, wird empfohlen, div anstelle von section zu verwenden. Funktion: Seiteninhalt in Blöcke aufteilen. Nicht zu verwechseln mit dem Artikelelement, das über einen eigenen vollständigen, unabhängigen Inhalt verfügt. Zusammenfassung: ① Verwenden Sie das Abschnittselement nicht als Seitencontainer zum Festlegen von Stilen, das ist die Aufgabe des div-Elements. ② Wenn das Artikelelement, das Nebenelement oder das Navigationselement besser für die Verwendung geeignet sind, verwenden Sie das Abschnittselement nicht. ③Verwenden Sie das Abschnittselement nicht für Inhaltsblöcke ohne Titel.

10. Neuer Strukturelementartikel: Element auf Blockebene. Stellt einen unabhängigen Inhalt auf der Seite dar, der kontextuell nicht relevant ist. Betonen Sie die Unabhängigkeit, der Abschnitt betont die Segmentierung oder Aufteilung und der Artikel betont die Unabhängigkeit.

11. Neues Strukturelement nebenbei: Element auf Blockebene. Stellt die Inhaltsposition des Artikelelements und den Hilfsinhalt in Bezug auf den Inhalt des Artikelelements dar.

12. Neues Strukturelement Header: Element auf Blockebene. Der Titel der gesamten Seite. Der Header muss mindestens eine Überschrift (h1-h6) oder ein hgroup-Element oder ein nav-Element enthalten.

13. Neues Strukturelement hgroup: Element auf Blockebene. Wird verwendet, um Titel für eine ganze Seite oder einen Inhaltsblock innerhalb einer Seite zu kombinieren. Wenn es nur einen Haupttitel gibt, wird hgroup nicht benötigt.

14. Neue Strukturelement-Fußzeile: Element auf Blockebene. Fußzeile für den Inhaltsblock.

15. Neue Strukturelementadresse: Inline-Element. Präsentieren Sie die Kontaktinformationen des Dokuments, einschließlich Autor, E-Mail usw.

16. Neue Strukturelementnavigation: Element auf Blockebene. Navigationslinks. Traditionelle Navigation, Seitenleistennavigation, In-Page-Navigation und Seitennavigation. Verwenden Sie in H5 kein Menü anstelle von Navigation. Das Menüelement ist eine Reihe von Menüs, die Befehle ausgeben. Es ist ein interaktives Element. Genauer gesagt wird es in Webanwendungen verwendet.

17. Neue Strukturelementfigur: Element auf Blockebene. Ein unabhängiger Teil des Stream-Inhalts stellt im Allgemeinen eine unabhängige Einheit des Dokument-Subjekt-Stream-Inhalts dar. Verwenden Sie das Element figcaption, um einer Gruppe von Abbildungselementen eine Beschriftung hinzuzufügen.

18. Neues Element Video: definiert Video.


Code kopieren
Der Code lautet wie folgt:


19. Neues Element Audio: Definiert Audio.


Code kopieren
Der Code lautet wie folgt:


20. Neues Element einbetten: Verschiedene Medien einfügen, das Format kann Midi, WAV, AIFF, AU, MP3 usw. sein.

21

Code kopieren
Der Code lautet wie folgt:

< object width= "320" height="240" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6 ,0, 40,0"> name="src" value=""borse.wav"/" />

22. Neue Elementmarkierung: hervorgehobener oder hervorgehobener Text. Ganz ähnlich wie span

23. Fortschritt des neuen Elements: Stellt den laufenden Prozess dar und zeigt den zeitaufwändigen Funktionsprozess in JavaScript an.


Code kopieren
Der Code lautet wie folgt:


24. Neues Element Zeit: stellt Datum und Uhrzeit dar.


Code kopieren
Der Code lautet wie folgt:

Span
wird in H4 25 verwendet. Neues Element Ruby: stellt Ruby-Kommentare dar. Han Han, das in h4 nicht verfügbar ist

26. Neues Element rt: repräsentiert die Interpretation oder Aussprache von Zeichen

27. Neues Element rp: Wird in Ruby verwendet, um den Inhalt zu definieren, der von Browsern angezeigt wird, die Ruby-Elemente nicht unterstützen.

28. Neues Element wbr: stellt einen weichen Zeilenumbruch dar. Der Unterschied zu br besteht darin, dass br bedeutet, dass hier ein Zeilenumbruch durchgeführt werden muss, während wbr bedeutet, dass kein Zeilenumbruch durchgeführt wird, wenn die Breite des Browsers oder des übergeordneten Elements breit genug ist Die Zeile wird hier automatisch umgebrochen. Wbr ist für zeichenbasierte Sprachen sehr nützlich, scheint aber keine große Auswirkung auf Chinesisch zu haben. Nicht verfügbar in H4.

29. Neues Element Canvas: stellt Grafiken dar. Zum Beispiel: Diagramme, Bilder. Aber: Das Element selbst hat kein Verhalten. Es wird lediglich eine Leinwand bereitgestellt und die Zeichnungs-API wird dem Client-JavaScript angezeigt, sodass das Skript die Zeichnung auf dieser Leinwand zeichnen kann.


Code kopieren
Der Code lautet wie folgt:


30. Neuer Elementbefehl: Stellt die Befehlsschaltfläche dar. Zum Beispiel: Optionsfelder, Kontrollkästchen, Schaltflächen.

Code kopieren
Der Code lautet wie folgt:


Es gibt kein

in HTML4

31. Neue Elementdetails: Zeigt die detaillierten Informationen an, die Details-Benutzer benötigen und erhalten können. Kann in Verbindung mit der Zusammenfassung verwendet werden. Die Zusammenfassung enthält einen Titel oder eine Legende.


Code kopieren
Der Code lautet wie folgt:

summary>html5< ;/summary>this ji a ddddd,you kdkdkdk about html5




32. Neues Element Datagrid: stellt eine Liste von Daten dar . Anzeige in Baumliste

33. Neues Element keygen: gibt den Generierungsschlüssel an

34. Neue Elementausgabe: repräsentiert verschiedene Arten der Ausgabe. Wie zum Beispiel Skript

35. Neue Elementquelle: Medienelement. Definieren Sie Medienressourcen. Verwenden Sie param

in H4

36. Neues Elementmenü: Stellt die Menüliste dar.

Code kopieren
Der Code lautet wie folgt:

< li>< ;/li>

  • Die Verwendung des Menüs in h4 wird nicht empfohlen.

    37. Neuer Eingabeelementtyp E-Mail: Gibt das Texteingabefeld an, in das die E-Mail eingegeben werden muss.

    38. Neue Eingabeelementtyp-URL: gibt an, dass die URL-Adresse eingegeben werden muss

    39. Neue Eingabeelementtypnummer: gibt an, dass ein numerischer Wert eingegeben werden muss.

    40. Neuer Eingabeelementtypbereich: Gibt an, dass numerische Werte innerhalb eines bestimmten Bereichs eingegeben werden müssen

    41. Neue Eingabeelementtyp-Datumsauswahl: Es gibt mehrere neue Eingabetextfelder in h5, mit denen Datums- und Uhrzeitangaben ausgewählt werden können.


    Code kopieren
    Der Code lautet wie folgt:

    Datum----- --- ------Tag, Monat, Jahr auswählen
    Monat-----------Monat, Jahr auswählen
    Woche------------ Woche und Jahr auswählen
    Zeit-------------Uhrzeit auswählen (Stunden und Minuten)
    DatumUhrzeit-------Uhrzeit, Tag, Monat, Jahr (UTC-Zeit) auswählen )
    Datetime-local – Wählen Sie Uhrzeit, Tag, Monat, Jahr (Ortszeit) aus

    44.
    1) Elemente abschaffen: Elemente, die nur einige Browser unterstützen: Applet, BGSound (nur vom IE unterstützt), Blink, Marquee und andere Elemente. bgsound (nur von ie unterstützt), marquee (nur von ie unterstützt), daher werden sie in h5 abgeschafft. Applet – kann durch Embed oder Object ersetzt werden. Bgsound – kann durch Audio ersetzt werden. Marquee kann durch JS-Programmierung ersetzt werden.
    2) Tag-Handbuchdefinition: Wird zum Kombinieren von Elementen verwendet. Nutzungsanleitung: Wird hauptsächlich für die Kombination von Bildern und Bildbeschreibungen verwendet:

    Kopieren Sie den Code
    Der Code lautet wie folgt:


    figure label
    Hier ist die Beschreibung von die Bildinformationen



    3) Erklärung des Etikettenhandbuchs: Menüliste definieren. Verwenden Sie diese Bezeichnung, wenn Sie Formularsteuerelemente auflisten möchten. Nutzungsleitfaden: Wird in Menüblöcken zum Definieren von Menülisten oder Menüoptionen verwendet:

    Code kopieren
    Der Code lautet wie folgt:



  • HTML 5

  • CSS

  • < ;li>JavaScript