Zusammenfassung und Einführung in das neue H5-Promotion-Tag (mit Beispielen)-HTML-Tutorial-php.cn

Zusammenfassung und Einführung in das neue H5-Promotion-Tag (mit Beispielen)

藏色散人

Freigeben： 2022-08-03 17:17:46

nach vorne

2499 Leute haben es durchsucht

Dieser Artikel stellt Ihnen die neuen Werbe-Tags von H5 vor. Ich hoffe, dass er Freunden in Not hilfreich sein wird!

1. Semantische Tags

<header></header>: Header-Tag <header></header>：头部标签

<nav></nav>：导航标签在H4中导航栏一般用ul-li标签，H5中可以直接用

<section></section>：块级标签

<article></article>：内容标签

<aside></aside>：侧边栏标签

<footer></footer>：尾部标签

注：

1.在ie9中需要把它们转化为块级元素 display:block
2.主要用于移动端
Zusammenfassung und Einführung in das neue H5-Promotion-Tag (mit Beispielen)

二、多媒体标签

<video></video>视频标签

<audio></audio>音频标签

三、图形标签

<canvas></canvas>

<nav></nav>: Navigations-Tag in H4-Navigationsleisten im Allgemeinen In H5 können Sie

-Tags direkt verwenden:

<section></section>: Inhalts-Tag

<aside></aside>: Seitenleisten-Tag

Zusammenfassung und Einführung in das neue H5-Promotion-Tag (mit Beispielen) <footer></footer>: Fußzeilen-Tag

Hinweis:

Zusammenfassung und Einführung in das neue H5-Promotion-Tag (mit Beispielen) 1 In ie9 müssen sie werden in Elemente auf Blockebene umgewandelt display:block

2. Wird hauptsächlich auf mobilen Endgeräten verwendet

Second, Multimedia Tag

& lt; Video & gt; >Audio-Tag<br><br><br>3. Grafik-Tag<br><br>

<canvas></canvas>Definieren Sie eine Grafik.

Verwenden Sie JavaScript, um Bilder auf Webseiten zu zeichnen.

Zum Beispiel: Zeigen Sie ein rotes Rechteck an:

<canvas id="myCanvas"></canvas>
<script type="text/javascript">
    var canvas=document.getElementById(&#39;myCanvas&#39;);
    var ctx=canvas.getContext(&#39;2d&#39;);
    ctx.fillStyle=&#39;#FF0000&#39;;
    ctx.fillRect(0,0,80,100);
</script>

Nach dem Login kopieren

4. Neue Formularelemente und Steuerelemente

<form>
         	<label>
         		邮箱 ：<input  type="email"  />
         		数量 ：
         		<input type="number" value="50" min="0" max="100" step="5">
                <!-- 最小值0、最大值100、步进值5、value初始值50 -->
         	</label>
         </form>

Nach dem Login kopieren

Hinzufügen:

🎜🎜Diesen Absatz bearbeiten Neue Anwendungsprogrammierschnittstelle (API)🎜 Zusätzlich Von der ursprünglichen DOM-Schnittstelle fügt HTML5 weitere APIs hinzu, wie zum Beispiel: 🎜 1. Canvas-Tag für Echtzeit-2D-Zeichnung 🎜 2. Geplante Medienwiedergabe 🎜 3. Offline-Datenbankspeicherung 🎜 4. Dokumentbearbeitung 🎜 5. Drag-Steuerung 🎜 6 . Verwaltung des Browserverlaufs 🎜🎜🎜 Zusammenfassung: 🎜🎜🎜🎜HTML 5 verfügt über zwei Hauptfunktionen: 🎜🎜🎜Erstens verbessert es die Leistung von Webseiten. Neben dem Zeichnen zweidimensionaler Grafiken werden auch Tags zum Abspielen von Video und Audio vorbereitet. 🎜🎜Zweitens wurden Webanwendungsfunktionen wie die lokale Datenbank hinzugefügt. 🎜🎜Verwandte Empfehlungen: „Was sind die neu hinzugefügten Attribute und Elemente in 🎜html5🎜“🎜🎜🎜

Das obige ist der detaillierte Inhalt vonZusammenfassung und Einführung in das neue H5-Promotion-Tag (mit Beispielen). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!