1. Einige veraltete Elemente in HTML4 wurden gestrichen Anzeige-Tags wie , die durch CSS ersetzt wurden, haben einige Vorschläge von XHTML2 übernommen, darunter einige zur Verbesserung der Dokumentation, wie z. B. die Verwendung neuer HTML-Tags für Kopfzeile, Fußzeile. Dialog, Aside, Figure usw. ermöglichen es den Erstellern von Inhalten, Dokumente semantischer zu erstellen 🎜>2 >
Die Tags „b“ und „i“ bleiben erhalten, ihre Bedeutung unterscheidet sich jedoch von zuvor. Die Bedeutung dieser Tags besteht darin, einen Textabschnitt zu kennzeichnen, anstatt die Schriftart „u“, „font“, „center“, „fett“ oder „kursiv“ festzulegen. und Strike-Tags werden vollständig entfernt.
Browser hinzugefügt. Nebenspeicherfunktionen wie localStorage/sessionStorage/indexedDB 6. Canvas-Objekt Bietet die Möglichkeit, Grafiken direkt zu zeichnen und zu bearbeiten 7. Neue
API
-Erweiterungen
für HTMLDocument und Die HTMLElement-Schnittstelle bietet neue API-Erweiterungen.
8. Neue Syntax
(1) DOCTYPE
Die HTML-Syntax von HTML5 erfordert, dass das Dokument DOCTYPE deklariert, um sicherzustellen, dass der Browser darin funktionieren kann Standardmodus Anzeigeseite. Die Deklarationsmethode ist:
Die Groß-/Kleinschreibung wird nicht beachtet. (2) Zeichensatz
In der HTML-Syntax von HTML5 gibt es drei Formen, um den Codierungstyp von
String
zu deklarieren: Legen Sie auf der Transportebene den Content-Type im Header der HTTP-Instanz fest.
Setzen Sie am Anfang der Datei ein Unicode Bype Order Mark (BOM). Dieses Zeichen stellt eine Signatur für die Codierungsmethode der Datei bereit.
Verwenden Sie im Inhalt zwischen den ersten 1024 Bytes des Dokuments das Meta-Element mit dem charset-Attribut, um die Kodierungsmethode zu deklarieren. Beispiel: .
<!DOCTYPE html>
Nach dem Login kopieren
(3) MathML und SVGDie HTML-Syntax von HTML5 ermöglicht die Verwendung von MathML (Mathematical Markup Language) und SVG (Scalable
Vektorgrafiken
) Element. Beispielsweise enthält eine sehr einfache HTML-Seite einen Kreis, der von einem SVG-Element gezeichnet wird:
Abschnitt
Das Abschnittselement ist das letzte Element, das die Seite unterteilt Dokumentstruktur Das grundlegende und wichtigste Strukturelement dient hauptsächlich der hierarchischen Aufteilung der Inhalte auf den Seiten der Website oder Anwendung. Ein Abschnittselement besteht normalerweise aus Inhalt und Titel.
Wenn der Inhalt des Elements zusammen angezeigt werden kann, um die entsprechende Bedeutung auszudrücken, kann es als Artikelelement definiert werden und es besteht keine Notwendigkeit, das Abschnittselement zu verwenden. Das
section-Element ist kein allgemeines Containerelement. Wenn ein Element daher einen entsprechenden Stil oder ein entsprechendes Skript definieren muss, wird empfohlen, das p-Element zu verwenden. Durch die Verwendung von section wird sichergestellt, dass der Inhalt dieses Elements definiert werden kann im Dokument klar ersichtlich sein.
Zum Beispiel:
<!DOCTYPE Html><html><head>
<title>Graduation Ceremony Summer 2022</title></head><body>
<h1>Graduation</h1>
<section>
<h1>Ceremony</h1>
<p>Opening Procession</p>
<p>Speech by Validactorian</p>
<p>Speech by Class President</p>
<p>Presentation of Diplomas</p>
<p>Closing Speech by Headmaster</p>
</section>
<section>
<h1>Graduates</h1>
<ul>
<li>Molly Carpenter</li>
<li>Anastasia Luccio</li>
<li>Ebenezar McCoy</li>
<li>Karrin Murphy</li>
<li>Thomas Raith</li>
<li>Susan Rodriguez</li>
</ul>
</section></body></html>
<article>
<h1>Safari 5 released</h1>
<p>7 Jun 2010. Just after the announcement of the new iPhone 4 at WWDC.</p>
<p>Apple announced the release of Safari 5 for Windows and Mac......</p></article>
Nach dem Login kopieren
nav
nav 元素是一个可以作为页面导航的链接组,其中的导航元素链接到其他页面或当前页面的其他部分。一个页面可以拥有多个nav元素,作为页面整体不同部分的导航。在nav元素中,一般以ul列表的形式来具体放置该组链接元素。
<body>
<header>
<h1>My Blog</h1>
</header>
<article>
<h1>My Blog Post</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua.</p>
<aside>
<h1>Glossary</h1>
<dl>
<dt>Lorem</dt>
<dd>ipsum dolor sit amet</dd>
</dl>
</aside>
</article>
<aside>
<h2>Blogroll</h2>
<ul>
<li><a href="#">My Friend</a></li>
<li><a href="#">My Other Friend</a></li>
<li><a href="#">My Best Friend</a></li>
</ul>
</aside></body>
<header>
<h1>The most important heading on this page</h1></header>
Nach dem Login kopieren
同一个页面内,每一个内容区块都可以有自己的header元素,例如:
<header>
<h1>The most important heading on this page</h1></header><article>
<header>
<h1>Title of this article</h1>
</header>
<p>...Lorem Ipsum dolor set amet...</p></article>
The HTML5 Doctor is run by the following group of volunteers:<address>
<a href="http://html5doctor.com/author/jacko">Jack Osborne</a>,
<a href="http://html5doctor.com/author/richc">Rich Clark</a>,
<a href="http://html5doctor.com/author/miker">Mike Robinson</a>,
</address>
Nach dem Login kopieren
下面是另一个范例:
<footer>
<p class="vcard"> by <address class="author">
<em class="fn"><a title="Posts by Jack Osborne" href="#">Jack Osborne</a></em>
</address> on <time datetime="2009-11-04" class="published updated">November 4th, 2009</time>
</p></footer>
<video width="640" height="360" src="http://www.youtube.com/demo/google_main.mp4" controls autobuffer>
<p>
Try this page in Safari 4! Or you can
<a href="http://www.youtube.com/demo/google_main.mp4">download the video</a>
instead. </p></video>
Das obige ist der detaillierte Inhalt vonCode-Sharing für die wichtigsten neuen Tags in HTML5. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Erklärung dieser Website
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
Anleitung zum Tabellenrahmen in HTML. Hier besprechen wir verschiedene Möglichkeiten zum Definieren von Tabellenrändern anhand von Beispielen für den Tabellenrand in HTML.
Dies ist eine Anleitung für verschachtelte Tabellen in HTML. Hier diskutieren wir anhand der entsprechenden Beispiele, wie man eine Tabelle innerhalb der Tabelle erstellt.
Anleitung zum Verschieben von Text in HTML. Hier besprechen wir eine Einführung, wie Marquee-Tags funktionieren, mit Syntax und Beispielen für die Implementierung.
Anleitung zum HTML-OnClick-Button. Hier diskutieren wir deren Einführung, Funktionsweise, Beispiele und Onclick-Events in verschiedenen Veranstaltungen.