Heim >Web-Frontend >H5-Tutorial >Welche neuen Tags und Attribute werden zu HTML5 hinzugefügt? Neue Tags und Attribute hinzugefügt (Zusammenfassung)

Welche neuen Tags und Attribute werden zu HTML5 hinzugefügt? Neue Tags und Attribute hinzugefügt (Zusammenfassung)

青灯夜游Original: 2018-09-15 18:10:094541Durchsuche

In diesem Kapitel erfahren Sie, welche neuen Tags und Attribute zu HTML5 hinzugefügt werden. Neue Tags und Attribute wurden hinzugefügt (Zusammenfassung), damit jeder weiß, welche Attribute und Tags in HTML5 neu hinzugefügt wurden. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird Ihnen hilfreich sein.

Zusammenfassung der neuen Funktionen von HTML5, die von jedem außer IE9 und niedriger verwendet werden können.

HTML5-Syntax

setzt größtenteils die Syntax von HTML fort

Der Unterschied: Die anfängliche

<!DOCTYPE html>
<html>
<meta charset="utf-8">

Zeichenkodierung wird Prägnant, Groß- und Kleinschreibung -unempfindliche, hinzugefügte boolesche Werte, ähnlich wie bei „checked“ und „selected“

Anführungszeichen können weggelassen werden, aber im Hinblick auf Codierungsstandards wird die Verwendung nicht empfohlen

Es gibt Tags, die weggelassen werden können Endzeichen und gänzlich weggelassene Etikettenanwendung.

Neu hinzugefügte Tags in HTML5:

1. Struktur-Tags

(1) Abschnitt : Unabhängiger Inhaltsblock, der h1~h6 verwenden kann, um eine Gliederung zur Angabe der Dokumentstruktur zu bilden. Er kann auch Kapitel, Kopfzeilen, Fußzeilen oder andere Teile der Kopfzeile enthalten. (2) Artikel: speziell unabhängig Block, der den Kerninhalt im Header dieser Seite angibt; Block-Header-Informationen/Titel;

(5) hgroup: ergänzender Inhalt der Header-Informationen/Titel;

(7) nav : Teilinformationen der Navigationsleiste;

(8) Abbildung: eine eigenständige Einheit, etwa ein Nachrichtenblock mit Bildern und Inhalten.

2. Formular-Tags

(1) E-Mail: E-Mail muss eingegeben werden

(2) URL: URL-Adresse muss eingegeben werden; 🎜>

(3) Zahl: Es muss ein Wert eingegeben werden.

(4) Bereich: Ein Wert innerhalb eines bestimmten Bereichs muss eingegeben werden.

(5) Datumsauswahl: Datum Auswahl;

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 auswählen Jahr (UTC-Zeit)
datetime-local: Uhrzeit, Tag, Monat, Jahr (Ortszeit) auswählen
(6) Suche: Suche nach regulären Textfeldern ;
(7) Farbe: Farbe.
3. Medien-Tags

(1) Video: Video

(2) Audio: Audio; ) einbetten: eingebettete Inhalte (einschließlich verschiedener Medien), Midi, Wav, AU, MP3, Flash, AIFF usw.

4. Andere funktionale Tags

(1) Markieren, Hervorheben (wie ein Textmarker zum Notieren);

(2) Fortschritt : Fortschrittsbalken; b5b04cd399fa66bedef0f622263ea031

(3) Zeit: Datenbezeichnung, wird von Suchmaschinen verwendet; datetime="2014-12-25T09:00">9:0091be1970faf1a1e6511e94af3a0f5b95Aktualisierungsdatum51f33e1919423ed2a6c50dd9a25e96a14:0091be1970faf1a1e6511e94af3a0f5b95

(4) Ruby und RT: Kommentieren Sie ein bestimmtes Wort. e1cd1ef8331b2927cc680afad7b5de59515718f19dfe6612658be14be18aa0ecWie wird angezeigt, wenn der Browser 21f25f120b8e75f2ae19a58ad1612dd6 nicht unterstützt? ;

(5) wbr: weicher Zeilenumbruch, Zeilenumbruch, wenn die Seitenbreite den erforderlichen Zeilenumbruch erreicht

(6) Canvas: Verwenden Sie JS-Code, um Inhalte für die Bildzeichnung zu erstellen; 🎜 >

(7) Befehl: Schaltfläche;

(8) Details: Menü erweitern;

(9) Datenfeld: Dropdown-Eingabeaufforderung; (10) keygen: Verschlüsselung.

Neue Attribute:

Attribute für js hinzugefügt.

<script defer src=".....js" onload="alert(&#39;a&#39;)"></script>
<script async src=".....js" onload="alert(&#39;b&#39;)"></script>

Wenn es keine der beiden oben genannten Attribute gibt, besteht die Ausführungsreihenfolge darin, zuerst den ersten src zu laden (herunterzuladen), dann seinen Onload auszuführen und dann das Defer-Attribut synchron nach unten auszuführen, bevor h5 bereits vorhanden ist Geben Sie dort das verzögerte Laden (verzögerte Ausführung) ein. Zuerst wird der Dateiinhalt in src geladen (heruntergeladen), dann gewartet, bis die Seite vollständig geladen ist, und dann das js.async-Attribut in onload geladen, was ein asynchrones Laden ist Laden Sie src nach dem Laden, führen Sie onload sofort aus und fahren Sie mit dem Laden der Seite in der oben genannten Ausführungsreihenfolge fort. In der Warnanzeige wird zuerst b und dann a angezeigt.

Fügen Sie den Stilcode des kleinen Symbols zum Tag auf der Webseite hinzu

<link rel="icon" href="url..." type="图片名称" sizes="16*16">

Geordnete Liste ol: Start hinzufügen (Startwert der Liste), umgekehrt (ob es ist invertiert) Menü Menütypattribut (3 Menütypen) eingebetteter CSS-Stil: Definieren Sie einen Stilblock (bereichsgebunden) innerhalb des Stil-Tags, der nur innerhalb des Stil-Tags gültig ist: iframe-Element, nahtlos randlos wird hinzugefügt Inhalt des Iframes.

d5ba1642137c3f32f4f4493ae923989c Neue Attribute:

bf4f163fd14ca33eceadbab93ddb4a65

f5ddcd46a19988c5249c012454268aa1

b04e8447e4604f774aa5d6f0f334b612 e99578b05f47dbac11dc1159d51d5c59

6396d3d3369c3bd5c4d84b4678534106

9ff8e1865e597d196f33a1083f914c85

335dd4bf5341cffed90d645d779dcb19

Manifestattribut:

Definieren Sie die Offline-Anwendungsdateien, die die Seite verwenden muss, normalerweise platziert im 100db36a723c770d327fc0aef2ce13b1-Tag

charset-Attribut:

Eines der Metaattribute, das den Zeichensatz der Seite definiert

sizes-Attribut:

2cdf5bf648cf2f33323966d7f58a7f3f Wenn das rel="-Symbol" des Links zum Festlegen der Symbolgröße verwendet wird, bedeutet

Basisattribut:

ffb65a9b8b8c20fb156d9d5f47c92c05 Beim Öffnen in einem neuen Fenster wird beim Erstellen einer Seite der Inhalt in href als Präfix zur Adresse hinzugefügt

Defer-Attribut:

Skript-Tag-Attribut, was bedeutet, dass nach dem Skript geladen wird, wird es nur ausgeführt, wenn die Seite auch geladen ist (Verzögerte Ausführung)

asynchrones Attribut:

Skript-Tag-Attribut, das unmittelbar nach dem Laden des Skripts ausgeführt wird (der Browser). analysiert den folgenden Inhalt während des laufenden Prozesses), auch wenn die Seite noch nicht geladen wurde (asynchrone Ausführung)

Medienattribut:

3499910bf9dac5ae3c52d5ede7383485 optimiertes

hreflang-Attribut:

3499910bf9dac5ae3c52d5ede7383485 Attribut, das die Sprache angibt, die von der URL verwendet wird, auf die der Hyperlink verweist

ref-Attribut:

< ;a>-Attribut, das definiert, ob der Hyperlink ein externer Link ist

umgekehrtes Attribut:

c34106e0b4e09414b63b2ea253ff83d6s Attribut, definiert, ob die Seriennummer ein Flashback ist

Start Attribut:

c34106e0b4e09414b63b2ea253ff83d6s Attribut, definiert den Startwert der Seriennummer.

Bereichsattribut:

Das Attribut des eingebetteten CSS-Stils. Die Definition von Dieser Stil ist auf das Element mit dem eingebetteten Stil beschränkt. Er eignet sich für die Einzelseitenentwicklung.

Globales HTML5-Attribut: Kann für jedes Tag verwendet werden, die folgenden 6

data-yourvalue, versteckt, Spenllecheck, tabindex, contenteditable, desginMode;

globale Attribute:

1 das Tag: data-custom Attributname.

hidden (zum Ausblenden direkt einfügen);

spellcheck="true" (Grammatikkorrektur);

tabindex="1" (Tab-Sprungsequenz); >

contenteditable="true" (bearbeitbarer Zustand, klicken Sie auf den zu ändernden Inhalt);

2. Fügen Sie window.document.designMode = 'on' in JavaScript ein (globale JavaScript-Eigenschaften, der gesamte Text). Seite kann bearbeitet werden).

Das obige ist der detaillierte Inhalt vonWelche neuen Tags und Attribute werden zu HTML5 hinzugefügt? Neue Tags und Attribute hinzugefügt (Zusammenfassung). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

JavaScript ruby html5 css html date JS number 异步 href alert 选择器 canvas http 搜索引擎

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：So verwenden Sie Canvas, um den Effekt eines Bestätigungscodes zu erzielen (Quellcode beigefügt)Nächster Artikel：So verwenden Sie Canvas, um den Effekt eines Bestätigungscodes zu erzielen (Quellcode beigefügt)

In Verbindung stehende Artikel

Mehr sehen