Grundlegende Struktur von HTML-Dokumenten (Grundkenntnisse zur Erstellung von Webseiten)
|
HTML-Funktionsprinzip: 1. Lokaler Vorgang: Öffnen Sie die HTML-Datei mit einem Browser 2. Fernzugriffsvorgang: Lokaler Browser greift auf Remote-Server (Tomcal) zu. Der Dateiname der Webseite sollte möglichst keine chinesischen Zeichen enthalten, da die Webseitendateien in Zukunft auf dem Server gespeichert werden. Es wird empfohlen, HTML-Dateien in Englisch zu speichern. Sie können entweder die Dateierweiterung .htm oder .html verwenden. 2. Grundstruktur eines HTML-Dokuments 1. Dokumentskelett: Alle Webseitendateien bestehen normalerweise aus den folgenden vier Tag-Paaren, die das Dokumentskelett bilden Code kopieren Der Code lautet wie folgt:<html> <Kopf> <title>Titel der Webseite</title> </Kopf></p> <p><Körper> Hier platzieren Sie den Inhalt, der auf der Webseite angezeigt werden soll </body> </html> <html>....</html>: markiert den Anfang und das Ende einer Webseite. Alle HTML-Elemente müssen zwischen diesen Tags platziert werden. <head>...</head>: identifiziert die Header-Informationen der Webseitendatei, wie z. B. Titel, Suchmaschinen-Schlüsselwörter usw. Der darin enthaltene Inhalt wird zuerst geladen <title>....</title>: Identifiziert den Titel der Webseitendatei <body>....</body>: bezeichnet den Hauptteil der Webseitendatei, also den sichtbaren Inhalt der Seite 2. Meta-Tags Das Meta-Tag wird verwendet, um Dateiinformationen zu definieren und die Webseite zu beschreiben, um die Suche in Suchmaschinen zu erleichtern. Es sollte zwischen <head> <head/> platziert werden. Schlüsselwörter festlegen: (kurz, für Suchmaschinen) Beschreibt die Version der Webseite: Beschreibt, mit welcher Software die Webseite erstellt wurde: Code kopieren Der Code lautet wie folgt:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>"> <html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>"> <Kopf> <meta http-equiv="Inhaltstyp" content="text/html; charset=utf-8" /> <meta name="keywords" content="Webdesign, Webseiten lernen" /> <meta name="description" content="Wie man Webdesign lernt, Methoden zum Erlernen von Webdesign, HTML-Handbuch Chinesisch" /> <meta name="author" content="123WORDPRESS.COM" /> <meta http-equiv="aktualisieren" content="2;url=http://www.baidu.com" /> <meta name="überarbeitet" content="html4.01"> <title>Grundstruktur des HTML-Dokuments_Meta-Tag</title> </Kopf> <Text> Das Meta-Tag wird verwendet, um Dateiinformationen zu definieren und die Webseite zu beschreiben, um die Suche in Suchmaschinen zu erleichtern. </body> </html> 3. Kopfbereich Code kopieren Der Code lautet wie folgt:<Kopf> <title>Titel der Webseite</title>Deklaration des Dateititels<mate>Einige Dokumentinformationen, wie etwa Dokumentschlüsselwörter, Beschreibung, Zeichensatzeinstellungen usw. <base> Hyperlink-URL-Basisreferenzpunkt JavaScript- und VBScript-Programme Stylesheet kann verwendet werden, um die Layout-Deklaration festzulegen <link> kann auf externe Dateien verweisen, wie etwa CSS-Layoutbeispiele </Kopf> 3. Syntax der HTML-Tags Die grundlegendste Syntax von HTML ist <tag>content</tag>. Tags werden normalerweise paarweise verwendet: ein öffnender und ein schließender Tag. Es gibt auch einen einzelnen Tag ohne schließenden Tag, wie beispielsweise <hr/> HTML-Tag-Typen: Einzel-Tag und Doppel-TagDoppel-Tag: Einzelne Markierung: Code kopieren Der Code lautet wie folgt:<!-- Mit Attributen: <tag name attribute="attribute value">...</tag name> Zum Beispiel: <font size="3">.....</font>--> <font size="4" color="#33FF00">2. Der Sportlehrer sagte: Wer es wagt, in meinem Unterricht einen Rock zu tragen, wird bestraft, indem er kopfüber steht! </font> </p> <p><!--Ohne Attribute: <tag name>...</tag name> Beispiel: <title>.....</title>--></p> <p><!--Mit Attributen: <tag name attribute="attribute value"> Beispiel: <hr width="200"/> (die Standardeinstellung ist zentriert)--> <hr width="200"/></p> <p><!--Kein Attribut: <Tag-Name> Wie zum Beispiel: Zeigt einen Zeilenumbruch, aber keinen Absatzumbruch an--></p> <p>3. Lebe in meinem Herzen, hast du die Miete bezahlt? 4. Durch dich habe ich mein Gesicht verloren und deshalb gebe ich dir nicht einmal eine Chance, wieder auf die Bühne zu kommen. |
<<: Detaillierte Erklärung zum einfachen Wechseln von CSS-Themen
>>: Implementierung einer Login-Seite basierend auf layui
Artikel empfehlen
Detaillierte Erklärung der gemischten Vererbung in Vue
Inhaltsverzeichnis Die Auswirkungen der gemischte...
Detaillierte Zusammenfassung der URI-Übereinstimmungsregeln der Nginx Location-Direktive
1. Einleitung Die Standortanweisung ist die Kernk...
Eine kurze Analyse zum Verständnis von Vue-Komponenten aus einer objektorientierten Perspektive
Wenn dieselbe Funktion und derselbe HTML-Code meh...
Installationsschritte von Docker-CE auf dem Raspberry Pi 4b Ubuntu19-Server
Das Raspberry Pi-Modell ist 4b, 1 G RAM. Das Syst...
Vue-Kapselungskomponente Bildkomponente hochladen
In diesem Artikelbeispiel wird der spezifische Co...
HarborRestart-Vorgang nach dem Ändern der Konfigurationsdatei
Ich werde nicht viel Unsinn erzählen, schauen wir...
Fehlereinfügungsanalyse der Funktion „updatexml()“ von MySQL
Verstehen Sie zunächst die Funktion updatexml() U...
Implementierung der Nginx-Domänennamenweiterleitung
Einführung in Nginx Nginx („engine x“) ist ein le...
Tutorial zum Bereitstellen des Open-Source-Projekts Tcloud mit Docker auf CentOS8
1. Docker installieren 1. Ich habe Centos7 in der...
Einführung in die Verwendung von CSS3-Filterattributen
1. Einleitung Beim Schreiben von Animationseffekt...
Beispielcode zum Konfigurieren von Nginx zur Unterstützung von https
1. Einleitung Lassen Sie Ihre Website immer noch ...
Grundlagen der MySQL-Speicher-Engine
Im vorherigen Artikel haben wir über MySQL-Transa...
So verwenden Sie Nginx zum Erstellen eines statischen Ressourcenservers
Nehmen wir Windows als Beispiel. Bei Linux ist es...
Detaillierte Erläuterung mehrerer praktischer Lösungen zum schnellen Löschen großer Datenmengen (zig Millionen) in MySQL
Der Autor stieß kürzlich bei seiner Arbeit auf ei...
Erfahren Sie, wie Sie Docker unter Windows 10 Home Edition installieren.
Als ich die Bücher über Redis und Spring Cloud Al...