1. Dokumenttyp-Deklarations-Tag 2. Lang-Sprachtyp 3. Zeichensatz 4. Allgemeine HTML-Tags HTML5-Dokumentdeklaration HTML5HTML 4.01XHTML 1.0
</DOCTYPE> Seine Funktion besteht darin, dem Browser mitzuteilen, welche HTML-Version er zum Anzeigen der Webseite verwenden soll.
Code: </DOCTYPE html> bedeutet, dass die HTML5-Version zum Anzeigen der Webseite verwendet wird
Zu beachten sind:
1. Die <!DOCTYPE>-Deklaration befindet sich ganz vorne im Dokument, vor dem <html>-Tag.
2. <!DOCTYPE> ist kein HTML-Tag
Dies wird im Allgemeinen verwendet
<!DOCTYPE html> <html lang="zh-CN">
Wird verwendet, um die Leistung der Dokumentanzeige zu definieren
de ---Englisch
zh-CN---Chinesisch
Ein Zeichensatz ist eine Sammlung von Zeichen, damit Computer Text erkennen und speichern können.
Innerhalb des <head>-Tags können Sie über das charset-Attribut des <meta>-Tags angeben, welche Zeichenkodierung das HTML-Dokument verwenden soll.
<meta charset="UTF-8"/>
„UTF-8“ wird auch Unicode genannt
4.1 Titel-Tag
<h1>Ich bin ein Titel der ersten Ebene</h1>
Merkmale:
Der Text mit dem Titel wird fetter und auch die Schriftgröße wird größer.
Ein Titel in einer eigenen Zeile
Beispiele sind wie folgt:
Das Hinzufügen von Titel-Tags muss in <body></body> platziert werden
Die Schriftart „Title Tag“ wird fetter und größer
Geben Sie alle Titel-Tags der sechs Ebenen ein
Jeder Titel nimmt eine Zeile ein und die Schriftgröße nimmt nacheinander ab. Solange der Titel hinzugefügt wird, wird die Schriftgröße fetter.
4.2 Absatz-Tags und Zeilenumbruch-Tags
<p>Ich bin ein Absatz-Tag</p>
Anzeigeeffekt (es gibt einen großen Abstand zwischen verschiedenen Absätzen)
Wenn Sie die Zeile umbrechen möchten, müssen Sie das Zeilenumbruch-Tag verwenden</br> (der Effekt wird nicht angezeigt).
Hier ist eine Webseite, die den Prozess verfolgt:
Dokumentieren
erhalten!
4.3 Textformat-Tags
Auf Webseiten müssen Sie manchmal Fett-, Kursiv- oder Unterstreichungseffekte für Text festlegen. In diesem Fall müssen Sie das Textformat-Tag in HTML verwenden (um die Wichtigkeit hervorzuheben, die wichtiger ist als gewöhnlicher Text).
Semantik | Etikett | veranschaulichen |
Deutlich | <strong></strong> oder <b></b> | Mehr empfehlen den ersten |
Schrägstrich | <em></em> oder <i></i> | Mehr empfehlen den ersten |
durchgestrichen | <del></del> oder <s></s> | Mehr empfehlen den ersten |
Unterstreichen | <ins></ins> oder <u></u> | Mehr empfehlen den ersten |
4.4 <div>- und <span>-Tags
Diese beiden Tags haben keine Semantik. Sie sind lediglich eine Box, die zum Speichern von Inhalten verwendet wird.
<div>Dies ist der Kopf</div> (es kann nur ein Div hintereinander platziert werden)
Zum Beispiel: <div>Märchenbuch</div>1997
Die Ausgabe sollte sein
<span>Heutiger Preis</span> (der Inhalt kann in einer Zeile angezeigt werden)
Zum Beispiel: <span>Grimms Märchen</span>
<span>Andersens Märchen</span>
<span>Fabeln des Äsop</span>
Die Ausgabe sollte sein:
4.5 Bild-Tags und Pfade
Wie füge ich Bilder in Webseiten ein?
In HTML wird das <img>-Tag verwendet, um Bilder in HTML-Seiten zu definieren
<img src="Bild-URL"/>
src ist ein erforderliches Attribut des <img>-Tags, das zur Angabe des Pfads und Dateinamens der Bilddatei verwendet wird.
Am besten platzieren Sie das Bild im selben Ordner wie die Webseite
Sie können es direkt auf der Webseite sehen, das Bild ist gekürzt ,
Hier sind die grundlegenden Eigenschaften von Bild-Tags
Eigentum | Attributwert | veranschaulichen |
src | Bildpfad | Erforderliche Attribute |
alt | Text | Ersetzen Sie Texte und Bilder, die nicht angezeigt werden können |
Titel | Text | Eingabeaufforderungstext, der Text wird angezeigt, wenn die Maus auf dem Bild platziert wird |
Breite | Pixel | Bildbreite einstellen |
Höhe | Pixel | Bildhöhe einstellen |
Grenze | Pixel | Legen Sie die Randstärke des Bildes fest |
Versuchen Sie es zunächst mit dem Alt-Attribut. Wenn das Bild nicht angezeigt werden kann, geben Sie <img src="image1.jpg" alt="Fairy Tale"/> ein (das Bild image1 existiert hier nicht und kann daher nicht angezeigt werden).
Versuchen Sie es dann erneut mit dem Titelattribut, geben Sie <img src="image.jpg" title="Fairy Tale"/> ein und probieren Sie diesen Effekt selbst aus.
Um die Breiten-, Höhen- und Randattribute zu testen, geben Sie <img src="image.jpg" title="Fairy Tale" width="300" height="100" border="15"/> ein
Was Sie bei Bild-Tags beachten sollten:
(1) Das Bild-Tag muss nach dem Tag-Namen geschrieben werden
(2) Die Attribute sind in keiner bestimmten Reihenfolge angeordnet, Attribute und Attribute müssen durch Leerzeichen getrennt werden.
(3) Formatschlüssel = „Wert“
4.6 Bild-Tags und Pfade
Pfade können unterteilt werden in: absolute Pfade und relative Pfade
1. Relativer Pfad
Dies ist die Position des Bildes relativ zur HTML-Seite
Relative Pfadklassifizierung | Symbol | veranschaulichen |
Gleicher Pfad | <img src="image.jpg"/> | |
Pfad der nächsten Ebene | / | <img src="images/baidu.gif"/> |
Vorheriger Levelpfad | ../ | <img src="../baidu.gif"/> |
2. Absoluter Pfad
Es ist der Pfad im landläufigen Sinne: „D:webimglogo.gif“
(Ich werde es später aktualisieren, wenn ich Zeit habe)
HTML5-Dokumentationserklärung
<!DOCTYPE html>
Der obige Codeblock ist eine HTML5-Dokumentdeklaration, die besagt, dass die aktuelle Webseite gemäß den HTML5-Standards geschrieben ist.
Achten Sie beim Schreiben einer Webseite darauf, die HTML5-Dokumentdeklaration oben auf der Webseite zu schreiben. Wenn Sie keine Dokumentdeklaration schreiben, wechseln einige Browser in einen seltsamen Modus. Nach dem Aufrufen des seltsamen Modus analysiert der Browser die Seite und die Seite wird nicht normal angezeigt. Um den Aufruf dieses Modus zu vermeiden, müssen Sie daher eine Dokumentanweisung schreiben.
Häufig verwendete Dokumentdeklarationen
<!DOCTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Hinweis: <!DOCTYPE> ist kein HTML-Tag. Es liefert dem Browser Informationen (eine Aussage) darüber, welche Version des HTML geschrieben wurde.
Um mit einigen alten Seiten kompatibel zu sein, verfügt der Browser über zwei Parsing-Modi:
Standardmodus Standardmodus
Macken-Modus, seltsamer Modus
Seltsame Modi führen beim Parsen von Webseiten zu unvorhersehbarem Verhalten, und wir sollten das Auftreten seltsamer Modi vermeiden.
Dateityp <HTML></HTML> (am Anfang und Ende der Datei platziert)
Damit ist dieser Artikel über HTML-Dokumenttyp-Deklarations-Tags abgeschlossen (Einsteiger-Tutorial). Durchsuchen Sie bitte frühere Artikel auf downcodes.com oder lesen Sie weiter in den folgenden verwandten Artikeln Zukunft. Unterstützen Sie downcodes.com!