Ausführliche Erläuterung der semantischen HTML5-Tags und der Kompatibilitätsverarbeitung

Header

wird hauptsächlich zur Einführung von Informationen am Kopf der Seite verwendet und kann auch für die Abschnittsüberschrift

verwendet werden. Der Titel kombiniert einen Titel und einen Untertitel oder eine Kombination aus Slogans

Miaowei Classroom

Nehmen Sie an einer humanen IT-Schulung teil

Navigation (eine Liste mit Links)

< ;nav>

LinkLink

Wunderbares Klassenzimmer

Wunderbares Klassenzimmer

< nav>

< ;h2>Wunderbare Premium-Kurse

• Javascript
• html+css

< /ul>

< ;footer>Der untere Teil der Fußzeile oder der untere Teil des Abschnitts

Die Abschnitte auf der Seite werden verwendet, um die Abschnitte auf der Seite zu unterteilen , oder die Unterteilung verschiedener Abschnitte im Artikel

werden verwendet, um eine Reihe strukturell vollständiger und unabhängiger Inhaltsteile auf der Seite darzustellen, die zur Präsentation eines Forumsbeitrags verwendet werden können . Ein Artikel in einer Zeitschrift oder Zeitung, ein Blog, vom Benutzer eingereichte Kommentarinhalte, interaktive Seitenmodul-Widgets usw.

Element-Tags können Referenzen, Seitenleisten, Anzeigen, Navigationselementgruppen und andere ähnliche Teile enthalten, die sich vom Hauptinhalt der aktuellen Seite oder dem Hauptinhalt unterscheiden Die Beiseite sollte sich auf den Inhalt des Artikels beziehen. In

als Hauptinhalt enthaltene Zusatzinformationen, bei denen der Inhalt außerhalb von

in Form von Zitaten, Wortlisten usw. im Zusammenhang mit dem aktuellen Artikel als Zusatzinformationen für die Seite oder Website verwendet wird als Ganzes; Die typischste Form ist die Seitenleiste, deren Inhalt benutzerfreundliche Links, zugehörige Navigation oder Werbeeinheiten sein können.

Im Allgemeinen für Bilder oder Videos verwendet

>< img src=“miaov.png“/>(beachten Sie, dass es kein Alt gibt)

Miaowei-Klassenzimmerfoto © Miaowixue

wird verwendet, um Uhrzeit oder Datum auszudrücken

Wir öffnen jeden Morgen um

Parameter

Ich habe ein Date am Valentinstag.

Optionsliste.

wird mit dem Eingabeelement verwendet, um die möglichen Werte der Eingabe zu definieren.

javascript

html

css

Wird verwendet, um die Details eines Dokuments oder eines bestimmten Teils des Dokuments zu beschreiben. Zitate usw. Es sollte mit dem Hauptinhalt der Seite übereinstimmen.

Öffnen-Attribut wird standardmäßig erweitert

< Zusammenfassung> Titel des Elements

Miaowei Classroom

Eine bekannte IT-Ausbildungseinrichtung in China< /p>

Dialog definieren

< dt>Teacher

2 +2 gleich?

Schüler

4

Lehrer

Richtige Antwort!

Definiert die Kontaktdaten des Autors des Beitrags oder der Seite

< ;mark> Wörter oder Sätze, die markiert werden müssen

Benutzer:

Öffentlicher Schlüssel:

Fortschrittsbalken definieren

76

tag

Für Browser wie IE6-8, die keine semantischen HTML5-Tags unterstützen, können wir Javascript verwenden, um sie wie folgt zu lösen:

Fügen Sie am Kopf der Seite hinzu:

<script></p> <p>document.createElement(“header”);</p> <p>document.createElement(“ nav");</p> <p>document.createElement("footer");</p> <p>......</p> <p></script>

Style

Semantische HTML5-Tags unter IE6-8, nachdem wir sie mit js erstellt haben, haben sie keinen Standardstil oder werden nicht einmal angezeigt, daher müssen wir die Standardanzeige für diese Tags im Stylesheet definieren

Neue Eingabesteuerung

E-Mail: E-Mail-Textfeld, nicht anders als bei normalen Eingaben. Wenn es sich bei der Eingabe nicht um eine E-Mail handelt, schlägt die Überprüfung fehl.

Tel: Telefonnummer

URL: URL der Webseite

Suche: Nach der Texteingabe im Suchmaschinen-Chrom wird ein zusätzliches geschlossenes X angezeigt

Bereich: Werteauswahl innerhalb eines bestimmten Bereichs min, max, Schritt (Anzahl der Schritte) Beispiel: Verwenden Sie JS, um den aktuellen Wert anzuzeigen

Neue Eingabesteuerung_2

Zahl: ein Eingabefeld, das nur Zahlen enthalten kann

color: Farbauswahl

datetime: Zeigt das vollständige Datum an

datetime-local: Zeigt das vollständige Datum ohne Zeitzone an

time: Zeigt die Zeit ohne Zeitzone an

Datum: Datum anzeigen

Woche: Woche anzeigen

Monat: Monat anzeigen

Neue Formularmerkmale und Funktionen

Platzhalter: Eingabefeld Beispiel einer Eingabeaufforderung Informationen: Weibo-Passwortfeld-Eingabeaufforderung

Autovervollständigung: Ob der Benutzereingabewert gespeichert werden soll, ist standardmäßig aktiviert. Um die Eingabeaufforderung auszuschalten, wählen Sie „Aus“ aus

Autofokus: Geben Sie das Formular an, um den Eingabefokus zu erhalten

Liste und Datenliste: Erstellen Sie eine Auswahlliste für das Eingabefeld. Der Listenwert ist die ID des Datenlisten-Tags

erforderlich: Dieses Element ist erforderlich und darf nicht leer sein

Muster: Reguläres Verifizierungsmuster="d{1 ,5}"

Formularverifizierung

Gültigkeitsobjekt Sie können überprüfen, ob die Verifizierung wie folgt bestanden wurde. true wird zurückgegeben. Wenn eine Überprüfung fehlschlägt, wird false zurückgegeben

oText.addEventListener("invalid",fn1,false);

ev.preventDefault()

valueMissing: wenn der Eingabewert leer ist

typeMismatch: Der Steuerwert entspricht der erwarteten Typinkongruenz

patternMismatch: Der Eingabewert entspricht nicht der Musterregelmäßigkeit

tooLong: überschreitet die maxLength maximale Grenze

rangeUnderflow: der überprüfte Bereichsminimalwert

rangeOverflow: Der maximale Wert des überprüften Bereichs

stepMismatch: Überprüfen Sie, ob der aktuelle Wert des Bereichs dem entspricht Regeln für Min., Max. und Schritt

customError entspricht nicht der benutzerdefinierten Überprüfung

setCustomValidity(); Benutzerdefinierte Validierung

Ungültiges Ereignis: Validierungsfeedback

Eingabe .addEventListener('invalid',fn,false)

Standardvalidierung verhindern: ev.preventDefault()

formnovalidate-Attribut: Validierung ausschalten

Formaction Definieren Sie die Übermittlungsadresse in abschicken

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der semantischen HTML5-Tags und der Kompatibilitätsverarbeitung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!