Zusammenfassung der Verwendung neuer Tags und Attribute in H5-HTML-Tutorial-php.cn

Dieses Mal werde ich Ihnen eine Zusammenfassung der Verwendung neuer Tags und Attribute in H5 geben. Was sind die Vorsichtsmaßnahmen für die Verwendung neuer Tags und Attribute in H5? ein Blick.

HTML5-Syntax

Die meisten Syntaxunterschiede von HTML bestehen weiterhin: der Anfang

<html lang="zh-CN">
<meta charset="utf-8"> Die Zeichenkodierung wird prägnant, <p style="text-align: left;"></p> unterscheidet nicht zwischen Groß- und Kleinschreibung, <p style="text-align: left;"></p> fügt einen booleschen Wert hinzu, ähnlich wie bei aktivierten, ausgewählten<p style="text-align: left;"></p> Anführungszeichen können weggelassen werden, Gemäß den Codierungsstandards wird jedoch davon abgeraten, dass <p style="text-align: left;"></p> Tags enthält, bei denen das Endzeichen weggelassen werden kann, und Tags, bei denen das Endzeichen vollständig weggelassen werden kann. <p style="text-align: left;"></p>
<p style="text-align: left;"><span style="color: #ff0000">Tags hinzufügen: <strong></strong></span></p>
<p style="text-align: left;">1. Struktur-Tags <strong></strong></p> (1) Abschnitt: unabhängiger Inhalt Blöcke können h1 ~ h6 verwenden, um eine Gliederung zur Darstellung der Dokumentstruktur zu bilden. Sie können auch Kapitel, Kopfzeilen, Fußzeilen oder andere Teile der Kopfzeile (2) enthalten: einen speziellen unabhängigen Block, der den Kern dieser Kopfzeile darstellt. Inhalt; (3) nebenbei: Zusatzinformationen, die sich auf den Tag-Inhalt beziehen, außer dem Tag-Inhalt; (4) Header: Header-Informationen/Titel eines bestimmten Blocks ( 6 ) Fußzeile: untere Informationen; (7) Navigation: Teilinformationen der Navigationsleiste (8) Abbildung: eine eigenständige Einheit, beispielsweise ein Nachrichtenblock mit Bildern und Inhalten. <p style="text-align: left;"></p>
<p style="text-align: left;">2. Formular-Tags <strong></strong></p> (1) E-Mail: eine E-Mail muss eingegeben werden; (2) URL: eine URL-Adresse muss eingegeben werden; ein numerischer Wert muss eingegeben werden; (4) Bereich: Werte innerhalb eines bestimmten Bereichs müssen eingegeben werden; (5) Datumsauswahl: <p style="text-align: left;">Datumsauswahl<a href="http://www.php.cn/code/7268.html" target="_blank">; , Monat, Jahr b.month: Monat, Jahr auswählen c.week: Woche und Jahr auswählen d.time: Uhrzeit auswählen (Stunden und Minuten) e.datetime: Uhrzeit, Tag, Monat, Jahr (UTC-Zeit) auswählen f.datetime -local: Uhrzeit, Tag, Monat, Jahr (Ortszeit) auswählen </a></p> (6) Suche: reguläre Textfelder durchsuchen <p style="text-align: left;"></p> (7) Farbe: Farbe <p style="text-align: left;"></p>
<p style="text-align: left;">3. Medien-Tags </p>
<p style="text-align: left;"><strong> (1) Video: Video (2) Audio: Audio (3) Einbettung: eingebetteter Inhalt (einschließlich verschiedener Medien), Midi, Wav, AU, MP3, Flash, AIFF usw. </strong></p>
<p style="text-align: left;">4. Andere Funktions-Tags </p>
<p style="text-align: left;"><strong> (1) Markieren: Markieren (wie ein Textmarker zum Notieren) (2) Fortschritt: </strong>Fortschrittsbalken</p> ; <progress max="Wert des maximalen Fortschrittsbalkens" value="Wert des aktuellen Fortschrittsbalkens"> 25T09: 00">9:00</time>Update date<time datetime="2015- 01-23T04:00" pubdate>4:00</time> (4) Ruby und rt: Kommentar zu einem bestimmten word; <ruby><rt>Kommentarinhalt</rt><rp>Anzeige, wenn der Browser dies nicht unterstützt</rp></ruby> Die Seitenbreite erreicht den Punkt, an dem Zeilenumbrüche erforderlich sind. (6) Canvas: Verwenden Sie JS-Code, um Inhalte für das Bildzeichnen zu erstellen. (7) Befehl: Menü erweitern (9) Datenfeld; Dropdown-Eingabeaufforderung; (10) keygen: Verschlüsselung; <p style="text-align: left;"><a href="http://www.php.cn/code/6151.html" target="_blank"></a></p>Neue Attribute: <p style="text-align: left;"><span style="color: #ff0000"><strong></strong>Attribute für js hinzugefügt. </span></p>
<pre class="brush:php;toolbar:false"><script defer src=".....js" onload="alert(&#39;a&#39;)"></script>
<script async src=".....js" onload="alert(&#39;b&#39;)"></script>

Nach dem Login kopieren

Wenn es keine der beiden oben genannten Attribute gibt, besteht die Ausführungsreihenfolge darin, zuerst den ersten Quellcode zu laden (herunterzuladen), dann seinen Onload auszuführen und ihn dann synchron nach unten auszuführen. Das Defer-Attribut ist bereits vor h5 vorhanden. Geben Sie verzögertes Laden (verzögerte Ausführung) ein. Zuerst wird der Dateiinhalt in src geladen (heruntergeladen), dann wird gewartet, bis die Seite vollständig geladen ist, und dann wird das js.async-Attribut in onload geladen, was ein asynchrones Laden ist Unmittelbar nach dem Laden von src. onload wird die Seite in der oben genannten Ausführungsreihenfolge weiter geladen. In der Warnanzeige wird zunächst b und dann ein Stilcode zum Hinzufügen kleiner Symbole zu den Tags auf der Webseite angezeigt

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

Nach dem Login kopieren

Geordnete Liste ol: Start (Startwert der Liste) hinzugefügt, umgekehrtes (ob umgekehrt) Menütypattribut (3 Menütypen) eingebetteter CSS-Stil: Definieren Sie einen Stilblock (bereichsbezogen) innerhalb des Tags, der nur ist gültig innerhalb des Style-Tags Inline-Frame: iframe-Element, nahtlos randlos wird hinzugefügt, srcdoc definiert den Inhalt des Inline-Frames

<iframe>新增属性：
<!--seamless定义框架无边框 无边距-->
<!--srcdoc的显示级别比sandbox高-->
<!--sandbox用来规定一个内嵌框架的安全级别-->
<!--sandbox="allow-forms:允许提交表单"-->
<!--sandbox="allow-origin:允许是相同的源"-->
<!--sandbox="allow-scripts：允许执行脚本"-->
<!--sandbox="allow-top-navigation:允许使外面的页面进行跳转"-->

Nach dem Login kopieren

manifest-Attribut:

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

charset-Attribut:

Eines der Metaattribute definiert den Zeichensatz von das Seiten-

Größenattribut:

Neues Attribut, wenn Link's rel="icon" verwendet wird, um die Symbolgröße festzulegen

Basisattribut:

bedeutet, dass beim Öffnen einer Seite in einem neuen Fenster der Inhalt im href als Präfix zur Adresse hinzugefügt wird

defer-Attribut:

Skript-Tag-Attribut, das angibt, dass das Skript nach dem Laden nur ausgeführt wird, wenn auch die Seite geladen wird (verzögerte Ausführung)

asynchrones Attribut :

Skript-Tag-Attribut, Skript wird geladen. Sofort nach Abschluss ausführen (der Browser analysiert den folgenden Inhalt während des Vorgangs), auch wenn die Seite noch nicht geladen wurde (asynchrone Ausführung)

Medienattribut :

-Elementattribut: bedeutet, für welches Gerät optimiert werden soll

hreflang-Attribut:

-Attribut, das die von der URL verwendete Sprache angibt durch den Hyperlink

ref-Attribut:

umgekehrtes Attribut: das Attribut von

<🎜; >

definiert, ob die Seriennummer ein Flashback-

Startattribut ist:

definiert den Startwert der Seriennummer

Bereichsattribut:

Attribut des eingebetteten CSS-Stils, die Definition dieses Stils ist auf diejenigen beschränkt, die über diese eingebetteten Stilelemente verfügen, geeignet für die Einzelseitenentwicklung

HTML5

Globale Attribute

: kann Für jedes Tag können die folgenden 6 verwendet werden: data-yourvalue, versteckt, Spenllecheck, tabindex, contenteditable, desginMode;

1 im Tag: data-custom-Attributname; versteckt (direkt einfügen, um es auszublenden); Klicken Sie auf den zu ändernden Inhalt); 2. In

window.document.designMode = 'on' eingefügt (eine globale Eigenschaft von JavaScript, der Text der gesamten Seite kann bearbeitet werden);

Empfohlene Lektüre:

Detaillierte Erläuterung der Verwendung des Node-Debugging-Tools

Detaillierte Erläuterung der Schritte der Webpack-Verpackung und Komprimierung von js und css

Das obige ist der detaillierte Inhalt vonZusammenfassung der Verwendung neuer Tags und Attribute in H5. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!