HTML-Einführungs-Tutorial

1. Einführung in HTML HTML (Hypertext Markup Language) ist eine Auszeichnungssprache, die zur Beschreibung von Webseitendokumenten verwendet wird.

HTML-Tags werden oft als HTML-Tags bezeichnet. HTML bietet viele Tags, wie Absatz-Tags, Titel-Tags, Hyperlink-Tags, Bild-Tags usw. Welche Inhalte auf der Webseite definiert werden müssen, kann mit den entsprechenden HTML-Tags beschrieben werden.

2. HTML-Struktur 1 2 表示文档标签 --> 3 标签表示文档的头部标签，在 标签中的信息是用于给浏览器识别的内容，如这里的 用于告知浏览器该文档的编码为UTF-8 --> 4 5 6 第一个HTML文件 表示该文档的标题 --> 7 8 9 标签为我们在浏览器中看到的内容 -->10 第一个HTML文件11 12 Der Inhalt des Kommentars wird in den Zeilen Symbole zwischen , der Laufeffekt im Browser ist wie folgt:

3. HTML-Header-Tag 3.1, &lt ;!DOCTYPE>-Tag -Tag befindet sich am Anfang des Dokuments und wird verwendet, um dem Browser anzuzeigen, welche HTML- oder XHTML-Standardspezifikation das aktuelle Dokument verwendet. Wird hauptsächlich als Grundlage für Browser zum Parsen von Dokument-Tags verwendet.

-Tag hängt mit der Browserkompatibilität zusammen. Wenn Sie löschen, bedeutet dies, dass der Browser den Inhalt der HTML-Seite anzeigt. Zu diesem Zeitpunkt kann die Seite so viele Anzeigeeffekte haben, wie es Browser wie IE6, IE7, IE8, Firefox2, Firefox3 und Chrome gibt, was nicht zulässig ist.

3.2. Das -Tag befindet sich nach dem verwendeten -Tag um den Browser zu informieren. Das -Tag markiert den Anfang des HTML-Dokuments und das -Tag markiert das Ende des HTML-Dokuments das Dokument. Alle Tags müssen zwischen den beiden schließenden Tags und geschrieben werden. Sie können die Hauptsprache des aktuellen Dokuments über das lang-Attribut festlegen, um Suchmaschinen beim Parsen des Dokuments zu helfen. Beispiel: bedeutet, dass die aktuelle Dokumentsprache Chinesisch ist .

3.3. -Tag

wird verwendet, um die Header-Informationen des HTML-Dokuments zu definieren, gefolgt von Nach dem -Tag. Der durch das head-Tag definierte Inhalt wird nur dem Browser bereitgestellt und nicht zur Benutzerpräsentation verwendet. wird hauptsächlich zum Einkapseln anderer Tags verwendet, die sich am Kopf des Dokuments befinden, z. B. , , und usw., die zur Beschreibung des Titels und des Autors verwendet werden und andere Dokumente des Dokuments Beziehungen usw. Ein HTML-Dokument kann nur ein Paar -Tags enthalten und die im Header der meisten Dokumente enthaltenen Daten werden nicht tatsächlich als Inhalt auf der Seite angezeigt.

3.4, -Tag

kann Metainformationen über die Seite bereitstellen (Metainformationen), z. B. für Suchmaschinen und Aktualisierungshäufigkeit, Abschlussbeschreibung und Schlüsselwörter. Das Tag befindet sich am Kopf des Dokuments und enthält keinen Inhalt. Die Eigenschaften des -Tags definieren die mit dem Dokument verknüpften Name/Wert-Paare. Beispiel:

„Schlüsselwörter“ ist ein häufig verwendeter Name. Es definiert eine Reihe von Schlüsselwörtern für das Dokument. Einige Suchmaschinen verwenden diese Schlüsselwörter, um Dokumente zu klassifizieren, wenn sie auf sie stoßen.

3.5, -Tag

wird verwendet, um den Titel der HTML-Seite zu definieren, d Name, der sich im befinden muss. Ein HTML-Dokument kann nur ein Paar von -Tags enthalten. Der Inhalt zwischen Sein grundlegendes grammatikalisches Format ist wie folgt:

网页标题名称 Der Titel-Tag ist entscheidend für die SEO der Website. Die Qualität des Titels wirkt sich direkt auf die SEO der Website aus .

3.6, -Tag

-Tag wird am häufigsten zum Verlinken externer CSS-Dateien verwendet,

Darüber hinaus kann es auch zur Einführung des Symbolsymbols der Website verwendet werden

4. HTML-Inhalts-Tags

4.1. Titel-Tags verwenden ; zur Darstellung, wobei die größte Überschrift definiert. definiert die kleinste Überschrift von mit abnehmender Bedeutung im Verhältnis zum aktuellen Dokument. Es wird empfohlen, dass das h1-Tag höchstens einmal auf der gesamten Seite erscheint (natürlich kann es überschritten werden, aber es ist der Such-SEO nicht förderlich). Titel-Tags werden verwendet, um die Bedeutung des Inhalts des Dokuments zu vermitteln. Verwenden Sie Titel nicht nur, um fetten oder großen Text zu erzeugen.

Hinweis: Der Browser fügt vor und nach dem Titel automatisch Leerzeilen ein.

4.2. Absatz-Tags Absätze werden durch definiert. Die p-Tags teilen sich keine Zeile, sondern belegen eine oder mehrere Zeilen .

4.3. Horizontale Linienmarkierung hr-Tag bedeutet das Einfügen einer horizontalen Linie in die Seite. Das

hr-Tag ist ein einzelnes Tag Es ist kein schließendes Tag erforderlich. , es ist kein schließendes Tag erforderlich.

4.5. Span-Tag -Tag kann mit kombiniert werden Andere Spans-Beschriftungen teilen sich eine Zeile. Normalerweise müssen Span-Tags formatiert werden, da sie sonst nicht vom anderen Text auf der Seite zu unterscheiden sind.

4.6. div-Tag

Elemente, um sie mit Stilen zu formatieren.

4.7. img-Tag

Das img>-Tag fügt kein Bild in die Webseite ein, sondern verlinkt das Bild von der Webseite. Das -Tag erstellt einen Platzhalterbereich für das referenzierte Bild. Das

-Tag verfügt über zwei erforderliche Attribute: das src-Attribut und das alt-Attribut.

5. Erweiterte HTML-Tags 5.1.1. Ungeordnete Liste

Die ungeordnete Liste wird durch das ul-Tag dargestellt, und die Listenelemente werden durch das li-Tag dargestellt Die verschiedenen Listenelemente in der ungeordneten Liste

haben keine Ordnungsebene und sind parallel

5.1.2. Geordnete Liste Eine geordnete Liste wird durch das ol-Tag dargestellt, und die Listenelemente werden auch durch das li-Tag dargestellt . Jedes Listenelement ist in einer bestimmten Reihenfolge angeordnet und definiert

Benutzerdefinierte Liste

Benutzerdefinierte Liste Wird oft verwendet, um Begriffe oder Substantive zu erklären und zu beschreiben. Vor dem Listenelement der Definitionsliste steht kein Aufzählungszeichen

5.2. Tabellen-Tag Eine einfache HTML-Tabelle besteht aus dem Tabellenelement und einem oder mehreren tr-, th- oder td-Elementen Tabellenzeilen, das th-Element definiert den Tabellenkopf und das td-Element definiert die Tabelleneinheit. Ein einfaches Beispiel lautet wie folgt:

Formularbezeichnung 5.3.1 , Formular-Tag Feld-Tag des Formulars, das zum Umschließen des Inhalts des gesamten Formulars verwendet wird. Ein Formular ist eine virtuelle Liste, mit der Benutzer Daten an das Backend übermitteln können. Das Formular besteht im Allgemeinen aus Textfeldern, Dropdown-Listen, Auswahlmöglichkeiten, Mehrfachauswahlmöglichkeiten, Textfeldern usw. Das Aktionsattribut wird verwendet, um die Adresse anzugeben, auf die verwiesen wird an das Backend gesendet, wenn das aktuelle Formular gesendet wird.

5.3.2. Eingabe-Tag Eingabe-Tag ist Textfeld, Optionsauswahl, Mehrfachauswahl, Schaltfläche usw. Unterschiedliche Werte des Type-Attributs bestimmen die Rolle des Eingabe-Tags.

Textfeld: Text Passwortfeld: Passwort Einzelauswahl: Radio Mehrfachauswahl: Kontrollkästchen Schaltfläche: Schaltfläche Senden-Schaltfläche: Senden Schaltfläche „Zurücksetzen“: Zurücksetzen

Das aktivierte Attribut des Eingabe-Tags hat nur einen aktivierten Attributwert und kann in Optionsschaltflächen und Mehrfachauswahlschaltflächen weggelassen werden bedeutet, dass diese Schaltfläche ausgewählt ist.

5.3.3. Tag auswählen Das Auswahlelement kann ein Einzelauswahl- oder Mehrfachauswahlmenü erstellen , -Tag im ;-Element definiert die in der Liste verfügbaren Optionen.

Multipe: Es ist auch ein einzelnes Attribut. Es gibt nur einen Mehrfachwert. Das Festlegen dieses Attributs bedeutet, dass sich das Select-Tag wie ein Listen-Tag verhält. Andernfalls stellt es die Dropdown-Listenbezeichnung dar.

5.3.4. Textbereichsbezeichnung Textbereichsbezeichnung, eine Beschriftung zur Eingabe einer großen Textmenge. Die Spalten der Textfeldbeschriftung geben an, wie viele Zeichenspalten untergebracht werden können. Wie viele Datenzeilen enthält Rows?

5.3.5, Etikettenetikett Mit dem Etikettenetikett kann das Etikett darauf zeigen, wenn auf den Etikettentext geklickt wird . Die Formularbeschriftung erhält den Fokus.

Zwei Möglichkeiten: 1. Verwenden Sie das for-Attribut, um auf die Formularbeschriftung zu verweisen. 2. Verwenden Sie die Etikettenbeschriftung, um die Formularbeschriftung zu umschließen.