Zusammenfassung gängiger HTML-Elemente, einschließlich Grundstruktur, Dokumenttyp, Kopfzeile, Textkörper usw.

Zusammenfassung gängiger HTML-Elemente, einschließlich Grundstruktur, Dokumenttyp, Kopfzeile, Textkörper usw.
1. Grundstruktur:

Code kopieren
Der Code lautet wie folgt:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<Kopf>
<meta http-equiv="Inhaltstyp" content="text/html; charset=UTF-8">
<Titel></Titel>
</Kopf>
<Text>
</body>
</html>

2. Dokumenttyp:

(1) HTML 4.01

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

(2) HTML5

<!DOCTYPE html>

(3) XHTML 1.0

Code kopieren
Der Code lautet wie folgt:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

3. Kopf:
(1) Zeichensatz

Code kopieren
Der Code lautet wie folgt:

<meta http-equiv="Inhaltstyp" content="text/html; charset=UTF-8">

(2) Einführung in JS

Code kopieren
Der Code lautet wie folgt:

<script language="javascript"></script>
<script language="javascript" src=""></script>
<script language="javascript">var u="__URL__";var a="__APP__";</script>
<script language="javascript" src="__PUBLIC__/js/jquery-1.8.1.min.js"></script>

(3) Einführung in CSS

Code kopieren
Der Code lautet wie folgt:

<style type="text/css"></style>
<link rel="stylesheet" href="" type="text/css">

(4) Legen Sie den Standardsprung fest

Code kopieren
Der Code lautet wie folgt:

<base href="" />
<base target="_blank" />

(5) Suchmaschinenbezogene Informationen festlegen

Code kopieren
Der Code lautet wie folgt:

<meta name="Beschreibung" Inhalt=",," />
<meta name="Schlüsselwörter" content=",," />

4. Betreff:

(1) Grundlegende Inhalte

Code kopieren
Der Code lautet wie folgt:

<body onload="">
<div id="" Klasse=""></div>
<div Stil="clear:both;">

(2) Formular
GET-Übermittlung: <form id="" action="" method="post"></form>
POST-Übermittlung: <form id="" action="" method="get"></form>

Mit Datei senden: <form id="" action="" method="post" enctype="multipart/form-data"></form>

Häufig auf der Homepage verwendet:

Code kopieren
Der Code lautet wie folgt:

<input id="Benutzername" name="Benutzername" class="" type="text" placeholder="Benutzername"></input>
<input id="Passwort" name="Passwort" class="" type="Passwort" placeholder="Passwort"></input>
<input id="login_button" class="button" type="button" value="Anmelden" onclick=""></input>
<input id="register_button" class="button" type="button" value="Registrieren" onclick="location.href=''">


Textfeld: <input id="" name="" class="" type="text"></input>

Passwortfeld: <input id="" name="" class="" type="password"></input>
Normale Schaltfläche: <input id="" name="" class="" type="button"></input>
Optionsfeld: <input id="" name="" class="" type="radio"></input>
Multiple-Choice-Schaltfläche: <input id="" name="" class="" type="checkbox"></input>

So zeigen Sie den hochgeladenen Dateinamen an:

<input id="" name="" class="" type="text" onchange="document.getElementById('').value=this.value"></input>
Dateiupload: <input id="" name="" class="" type="file"></input>
Verstecktes Feld: <input id="" name="" class="" type="hidden"></input>
Senden-Schaltfläche: <input id="" name="" class="" type="submit"></input>
Schaltfläche zum Senden des Bildes: <input id="" name="" class="" type="image"></input>
Reset-Taste: <input id="" name="" class="" type="reset"></input>

Mehrzeiliger Textbereich: <textarea cols="" rows="" id="" name=""></textarea>

Dropdown-Menü:

Code kopieren
Der Code lautet wie folgt:

<Name auswählen="" Größe="" mehrere>
<Optionswert="" ausgewählt></Option>
<Optionswert=""></Option>
</Auswählen>

(3) Klicken Sie auf den Hyperlink, um zu JS zu springen: <a class="" href="#" id="" onclick="location.href=''"></a>
Leerer Hyperlink (klicken, um zum Seitenanfang zu springen): <a href="#"></a>
Leerer Hyperlink (kein Klick): <a href="javascript:void(0);"></a>

Bild-Hyperlink: <a href=""><img width="" height="" src=""></a>

(4) Bild Normales Bild: <img src="" >

Breite und Höhe des Bildes festlegen (proportional verkleinert, die Dateigröße bleibt unverändert): <img width="" height="" src="">

(5) Tabelle

Code kopieren
Der Code lautet wie folgt:

<table border="1" cellpadding="10" cellspacing="0">
<tr>
<th width="100px">A</th>
<th width="200px">B</th>
</tr>
<tr>
<td>EIN</td>
<td>B</td>
</tr>
</Tabelle>

(6) Liste

Ungeordnete Liste:

Code kopieren
Der Code lautet wie folgt:

<ul Typ="Scheibe">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ul>
<ul Typ="Quadrat">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ul>
<ul Typ="Kreis">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ul>

Sortierte Liste:

Code kopieren
Der Code lautet wie folgt:

<ol Typ="1">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ol>
<ol Typ="a">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ol>
<ol Typ="A">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ol>
<ol Typ="i">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ol>
<ol Typ="Ich">
<li>Erster Punkt</li>
<li>Zweiter Punkt</li>
</ol>

(7) Multimedia

Laufende Untertitel: <marquee></marquee>

Hintergrundmusik: <bgsound></bgsound>

Audio, Video, Flash, MPEG usw.: <embed></embed>

(8) Zeilenkontrolle

Titel: <hn></hn>

Absatz: <p></p>

Zeilenumbrüche: <br>

Horizontale Linie: <hr>

5. Rahmen

Code kopieren
Der Code lautet wie folgt:

<frameset rows="50% 50%">
<farme src="">
<farme src="">
</frameset>

<<:  Verschiedene Möglichkeiten, den Aushöhlungseffekt der CSS3-Maskenebene zu erzielen

>>:  Apropos „Weniger und mehr“ im Webdesign (Bild)

Artikel empfehlen

Verwenden Sie thead, tfoot und tbody, um eine Tabelle zu erstellen

Manche Leute verwenden diese drei Tags auf pervers...

Lösung zur Bereinigung des Docker-Festplattenspeichers

Vor einiger Zeit stieß ich auf das Problem, dass ...

Zusammenfassung der Vue3-Slot-Nutzung

Inhaltsverzeichnis 1. Einführung in den V-Slot 2....

Lösungen für Kompatibilitätsprobleme mit virtuellen VMware-Workstation-Maschinen

Wie lassen sich Kompatibilitätsprobleme mit virtu...

Detaillierte Erläuterung der Fallstricke von DTS, die durch die Zeitstempel- und Datums-/Uhrzeitzonenprobleme in MySQL verursacht werden

Inhaltsverzeichnis Wie wird die aktuelle Uhrzeit ...

RGB-Farbtabellensammlung

RGB-Farbtabelle Farbe Englischer Name RGB 16 Farb...

Detaillierte Erklärung zur Verwendung der Funktionen IF(), IFNULL(), NULLIF() und ISNULL() in MySQL

In MySQL können Sie die Funktionen IF(), IFNULL()...

Analyse der Verwendung des Linux-Schwachstellen-Scan-Tools lynis

Vorwort: Lynis ist ein Sicherheitsprüfungs- und H...

mysql implementiert den Import nur einer angegebenen Tabelle aus der SQL-Datei der exportierten Daten

Szenario Gestern hat das System automatisch alle ...

Lösung für das Problem, dass der Z-Index in CSS3 nicht wirksam wird

Ich habe vor kurzem eine Kombination aus CSS3 und...

Linux nutzt duale Netzwerkkartenbindung und Schraubendreherschnittstelle

Was ist eine Bindung? NIC-Bond ist eine Technolog...

Einfache und schnelle Einführung in die React-Routing-Entwicklung

Installieren Geben Sie zur Installation den folge...

Node-Skript realisiert automatische Anmelde- und Lotteriefunktion

Inhaltsverzeichnis 1. Einleitung 2. Vorbereitung ...

So verwenden Sie Vue zum Entwickeln öffentlicher Account-Webseiten

Inhaltsverzeichnis Projekthintergrund Start Erste...

Ich zeige Ihnen, wie Sie Schriftsymbole in CSS verwenden

Zunächst einmal: Was ist ein Schriftsymbol? Oberf...