Lassen Sie uns über den Unterschied zwischen HTML und HTML5 sprechen

Jemand hat mich heute gefragt, ob Sie häufig HTML5 oder HTML verwenden? emmm... Wenn ich normalerweise Webseiten schreibe, mache ich eigentlich keinen besonderen Unterschied zwischen den beiden. Wenn ich über die Unterschiede sprechen muss, sind die offensichtlichen Unterschiede die, die ich unten aufführe. Was ein tieferes Verständnis betrifft: HTML5 ist weit über den Rahmen einer Auszeichnungssprache hinausgegangen. Dahinter steckt eine Reihe von Technologien. Xiaobais Arbeitszimmer ist zu oberflächlich und er wagt es nicht, viel zu reden. >.<

1. Die Dokumenttypdeklaration ist anders

html:

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

html5: Die Dokumentdeklaration ist relativ einfach und für Programmierer leicht zu lesen und sich schnell entwickeln.

2. Semantische Struktur

html: Es gibt kein strukturelles semantisches Tag (für Laien ist es unpraktisch zu lesen und nicht aussagekräftig). Sie wissen, wohin Sie gehen sollen) Wo ist der Kopf, wo ist der Schwanz)

html5: Viele semantische Tags werden hinzugefügt,

macht die Codestruktur klar und verbessert die Lesbarkeit des Codes.

Im Folgenden sind einige semantische Tags in HTML5 aufgeführt:

< title>: kurz, beschreibend, eindeutig (verbessert das Suchmaschinenranking)

: h1~h6 hierarchische Überschriften, die zum Erstellen hierarchischer Beziehungen von Seiteninformationen verwendet werden.

: Der Header enthält normalerweise das Website-Logo, die Hauptnavigation, seitenweite Links und ein Suchfeld.

eignet sich auch zum Markieren einer Reihe von Einführungs- oder Navigationsinhalten innerhalb der Seite.

: Navigation markieren, wird nur für wichtige Linkgruppen im Dokument verwendet.

: Der Hauptinhalt der Seite, der nur einmal auf einer Seite verwendet werden kann. Wenn es sich um eine Webanwendung handelt, umgeben Sie deren Hauptfunktionen.

: Stellt ein Dokument, eine Seite, eine Anwendung oder einen unabhängigen Container dar.

: Eine Gruppe mit ähnlichen Themen B. die Homepage einer Website, kann in Abschnitte für Einführung, Nachrichten, Kontaktinformationen und mehr unterteilt werden.

: Geben Sie die Seitenleistenspalte an, einschließlich Zitaten, Seitenleisten, einer Reihe von Links zu Artikeln, Anzeigen, benutzerfreundlichen Links, verwandten Produktlisten usw.

: Fußzeile. Nur wenn das übergeordnete Element der Hauptteil ist, handelt es sich um die Fußzeile der gesamten Seite.

: Geben Sie die Details an und geben Sie Haftungsausschluss, Anmerkung, Signatur und Urheberrecht ein.

sollte nur für Phrasen verwendet werden und nicht zur Kennzeichnung langer rechtlicher Aussagen wie „Nutzungsbedingungen“ oder „Datenschutzerklärung“.

: Zeigt die Wichtigkeit des Inhalts an.

: Markieren Sie die wichtigsten Punkte des Inhalts (wird hauptsächlich zur Verbesserung der Semantik von Absatztexten verwendet).

: Markieren Sie den Text (gelb), um die Leser daran zu erinnern.

In HTML5 ist em das einzige Element, das Hervorhebung darstellt, während strong für Wichtigkeit steht.

: Ein Textblock, der den Leser an praktische Zwecke erinnert und keine zusätzliche Bedeutung vermittelt

: Anderer Text für andere Texte = =|||Diese Übersetzung ist wirklich...

: Erstellen Sie eine Figur (der Standardwert ist etwa 40 Pixel Rand).

: Der Titel der Abbildung muss das erste oder letzte in der Abbildung eingebettete Element sein.

: Geben Sie ein Zitat oder eine Referenz an, z. B. den Titel eines Buches, den Namen eines Lieds, eines Films usw., eines Konzerts, eines Konzerts, einer Spezifikation, einer Zeitung usw. oder juristisches Dokument usw.

sollte nur verwendet werden, um auf die Quelle selbst zu verweisen, nicht um daraus zu zitieren.

: zitierter Text, der standardmäßig in einer neuen Zeile angezeigt wird.

: kurzes Zitat (browserübergreifende Probleme, vermeiden Sie die Verwendung).

Sie können das Cite-Attribut für Blockquoto- und Q-Elemente verwenden (nicht das Cite-Element!), was für Suchmaschinen-Automatisierungstools nützlich ist. cite=“URL“ zitiert die Quelladresse.

: Markieren Sie die Zeit. Das datetime-Attribut folgt einem bestimmten Format. Wenn dieses Attribut weggelassen wird, muss der Textinhalt in einem zulässigen Datums- oder Uhrzeitformat vorliegen. Zeiten, die nicht mehr relevant sind, werden mit s gekennzeichnet.

: Erklärung der Abkürzungen. Verwenden Sie das Titelattribut, um den vollständigen Namen anzugeben. Dies ist in Ordnung, wenn es nur beim ersten Vorkommen verwendet wird.

abbr[title]{ border-bottom:1px dotted #000; }

: Definitionsbegriffselement, das neben der Definition stehen muss, kann Wird im DL-Element der Beschreibungsliste verwendet.

: Kontaktinformationen (E-Mail-Adresse, Link zur Kontaktseite) für den Autor, die Person oder die Organisation.

Wenn Sie die Kontaktinformationen des Autors für die gesamte Seite angeben, werden diese normalerweise in der Fußzeile auf Seitenebene platziert. Es darf keine Dokumente oder andere Inhalte wie Dokumente enthalten.

: Inhalt entfernt.

: Inhalt hinzugefügt.

Ein seltenes Element, das sowohl Blockebene als auch Phraseninhalte umgeben kann.

: Code markieren. Enthält Beispielcode oder Dateinamen (< > )

: vorformatierter Text. Behält die inhärenten Zeilenumbrüche und Leerzeichen des Textes bei.

3.html5-Zeichenfunktion

1) Leinwand

Vor HTML5 konnten Web-Frontend-Entwickler nicht zeichnen HTML Bilder dynamisch auf der Seite zeichnen 1) HTM5 fügt ein neues -Element hinzu, das einem Canvas entspricht. Es verfügt jedoch nicht über die Möglichkeit, Bilder selbst zu zeichnen, und es muss ein Skript verwendet werden um die eigentliche Zeichenaufgabe abzuschließen. Mit der getContext-Methode können Sie ein Objekt zurückgeben, das die Eigenschaften und Methoden des Malens bereitstellt.

• Schritt 1: Holen Sie sich das DOM-Objekt

• Schritt 2: Rufen Sie die getContext()-Methode des Canvas-Objekts auf, um das CanvasRederingContext2D-Objekt abzurufen (übergeben ein Parameter in der getContext-Methode: „2d“)

• Schritt 3: CanvasRederingContext2D aufrufen, um die Zeichnung abzuschließen

2) SVG: Skalierbare Vektorgrafiken, die zum Definieren verwendet werden vektorbasierte Grafiken für das Netzwerk.

Vielen Dank an alle fürs Lesen, ich hoffe, dass Sie viel davon profitieren werden.

Dieser Artikel ist reproduziert von: https://blog.csdn.net/yezi__6/article/details/82881729

Empfohlenes Tutorial: „HTML-Tutorial“

Das obige ist der detaillierte Inhalt vonLassen Sie uns über den Unterschied zwischen HTML und HTML5 sprechen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!