HTML-Grundlagen: Die grundlegende Struktur von HTML
|
Die Grundstruktur von HTML-Hypertextdokumenten besteht aus zwei Teilen: Dokumentkopf und Dokumentkörper. Im Dokumentkopf werden einige notwendige Definitionen des Dokuments vorgenommen, und der Dokumentkörper enthält verschiedene anzuzeigende Dokumentinformationen. <HTML> <KOPF> Header-Informationen</HEAD> <KÖRPER> Dokumentkörper, Textteil</BODY> </HTML> Unter ihnen befindet sich <HTML> in der äußersten Ebene und zeigt an, dass der Inhalt zwischen diesem Tag-Paar ein HTML-Dokument ist. Wir werden auch sehen, dass auf einigen Homepages das <HTML>-Tag weggelassen wird, da Webbrowser davon ausgehen, dass es sich bei .html- oder .htm-Dateien um HTML-Dokumente handelt. <HEAD> enthält die Kopfzeileninformationen des Dokuments, beispielsweise den Gesamttitel des Dokuments usw. Wenn keine Kopfzeileninformationen benötigt werden, kann dieses Tag weggelassen werden. Das <BODY>-Tag wird grundsätzlich nicht weggelassen und kennzeichnet den Beginn des Hauptinhalts. Nachfolgend sehen Sie den Quellcode eines einfachen Hypertext-Dokuments: <HTML> <KOPF> <TITLE>Ein einfaches HTML-Beispiel</TITLE> </KOPF> <KÖRPER> <MITTE> <H3>Willkommen auf meiner Homepage</H3> <BR> <HR> <SCHRIFTGRÖSSE=2> Dies ist das erste Mal, dass ich eine Homepage erstelle. Egal was passiert, ich werde mein Bestes geben, damit es gut wird! </FONT> </CENTER> </BODY> </HTML> ━┓ ┃Dateikopf━┛ ━┓ ┃ ┃ ┃ ┃Dokumententext┃ ┃ ┃ ┃ ━┛ Tags in Hypertexten <br />Wenn Sie zum ersten Mal mit Hypertext in Berührung kommen, sind die in „<“ und „>“ eingeschlossenen Sätze das größte Hindernis. Wir nennen sie Tags. Das sind Elemente, die zum Unterteilen und Markieren von Text verwendet werden, um das Layout des Textes, das Format des Textes und farbige Bilder zu gestalten. 1. Einzelne Tags Manche Tags werden „einzelne Tags“ genannt, weil sie ihre Bedeutung vollständig ausdrücken können, wenn sie allein verwendet werden. Die Syntax solcher Tags lautet: <Tag-Name> Das am häufigsten verwendete einzelne Tag ist <BR>, das einen Zeilenumbruch anzeigt. 2. Doppeltag Ein anderer Tag-Typ wird „Doppeltag“ genannt. Er besteht aus zwei Teilen: „Starttag“ und „Endtag“ und muss paarweise verwendet werden. Der Starttag weist den Webbrowser an, die durch den Tag dargestellte Funktion von hier aus auszuführen, und der Endtag weist den Webbrowser an, die Funktion hier zu beenden. Durch Hinzufügen eines Schrägstrichs (/) vor dem Start-Tag wird dieser zu einem End-Tag. Die Syntax für diesen Tag-Typ lautet: <tag>Inhalt</tag> Dieses Tag-Paar beeinflusst den Teil „Inhalt“. Wenn Sie beispielsweise einen bestimmten Text hervorheben möchten, fügen Sie ihn in ein <EM> </EM>-Tag ein: Erste: 3. Tag-Attribute Viele Start-Tags mit Einzel- und Doppel-Tags können einige Attribute enthalten. Die Syntax lautet: < Tag Name Attribut 1 Attribut 2 Attribut 3 … > Es gibt keine Rangfolge zwischen den Attributen, und die Attribute können weggelassen werden (d. h., die Standardwerte werden übernommen). Beispielsweise bedeutet das einzelne Tag <HR>, dass an der aktuellen Position des Dokuments eine horizontale Linie gezeichnet wird, im Allgemeinen vom äußersten linken Ende der aktuellen Zeile im Fenster bis zum äußersten rechten Ende. Mit einigen Attributen: <HR SIZE=3 ALIGN=LEFT WIDTH="75%"> Das SIZE-Attribut definiert die Linienstärke. Der Attributwert ist eine Ganzzahl und 1 fehlt. Das ALIGN-Attribut stellt die Ausrichtung dar, die LEFT (linksbündig, Standardwert), CENTER (zentriert) oder RIGHT (rechtsbündig) sein kann. Das WIDTH-Attribut definiert die Länge der Linie, die ein relativer Wert (ein Prozentsatz, der in ein Paar " "-Zeichen eingeschlossen ist und den Prozentsatz relativ zur Füllung des gesamten Fensters angibt) oder ein absoluter Wert (die Anzahl der Bildschirmpixel, ausgedrückt als Ganzzahl, z. B. WIDTH=300) sein kann. Der Standardwert ist "100%". |
Artikel empfehlen
React implementiert die Prinzipanalyse der drei Phasen Laden, Laden, Abschluss und Ladefehler
Kürzlich schrieb ich in meinem Blog, dass ich fes...
Erstellen eines Redis-Clusters auf Docker
Inhaltsverzeichnis 1. Ziehen Sie das Bild 2. Erst...
So verwenden Sie das Videowiedergabe-Plugin DPlayer.js
Das Videoplayer-Plugin DPlayer.js ist einfach zu ...
Der Unterschied zwischen br und br/ in HTML
Antwort von Stackflow: Einfaches <br> genügt...
Details nach dem Setzen des src des Iframes auf about:blank
Nachdem die Quelle des Iframes auf „about:blank“ g...
Bereitstellung des Quellcodes des Docker-Containers. httpd verwendet Speichervolumen, um die Website bereitzustellen (empfohlen).
Inhaltsverzeichnis Stellen Sie httpd mit dem Quel...
Schritte zur Implementierung des cuda10.1-Treibers bei der Installation von Ubuntu
1. Laden Sie cuda10.1 herunter: Link zur offiziel...
Beispiel für den automatischen Start eines Anwendungsdienstes in einem Docker-Container
Wenn Sie möchten, dass der Anwendungsdienst im Do...
Eine elegantere Methode zur Fehlerbehandlung in JavaScript async await
Inhaltsverzeichnis Hintergrund Warum Fehlerbehand...
Einfache Schritte zum Kapseln von Komponenten in Vue-Projekten
Inhaltsverzeichnis Vorwort So kapseln Sie eine To...
Schritte zum Übertragen von Dateien und Ordnern zwischen zwei Linux-Servern
Heute habe ich mich mit der Migration eines Proje...
JavaScript implementiert die Operationen „Alle auswählen“ und „Alle abwählen“
In diesem Artikel wird der spezifische Code für J...
Tutorial zur Installation von MySQL auf Alibaba Cloud Centos 7.5
Es scheint, dass die MySQL-Server-Datei zur norma...
JavaScript implementiert einen verschiebbaren Fortschrittsbalken
In diesem Artikel wird der spezifische JavaScript...
Analyse der Anweisungsausführungsreihenfolge von SQL und MySQL
Ich bin heute auf ein Problem gestoßen: Kann ich ...