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

So sichern Sie MySQL unter Linux automatisch remote

Vorwort: Ganz gleich, ob wir es für den Eigengebr...

Zabbix überwacht die MySQL-Instanzmethode

1. Überwachungsplanung Bevor Sie ein Überwachungs...

So erstellen Sie ein neues Image basierend auf einem vorhandenen Image in Docker

Das Erstellen neuer Images aus vorhandenen Images...

Detaillierte Schritte zur Installation der dekomprimierten Version von MySQL 5.7.20 (zwei Methoden)

Ich werde die Installation von MySQL unter Window...

Detaillierte Erklärung der schmerzlosen Token-Aktualisierungsmethode von Uniapp

Wenn das Front-End die Schnittstelle anfordert, w...

Kopieren von Node.js-Dateien, Erstellen von Ordnern und andere damit verbundene Vorgänge

NodeJS kopiert die Dateien: Für den Kopiervorgang...

Implementierung der Vue-Nuxt-Anmeldeauthentifizierung

Inhaltsverzeichnis einführen Link Start Gehen Sie...

Befehlscodebeispiele für die Installation und Konfiguration von Docker

Docker-Installation Installieren von Abhängigkeit...

MySQL-Lernen (VII): Detaillierte Erläuterung des Implementierungsprinzips des Innodb Storage Engine-Index

Überblick In einer Datenbank wird ein Index verwe...

So installieren Sie Docker CE auf Ubuntu 18.04 (Community Edition)

Deinstallieren Sie alte Versionen Sollten Sie zuv...

Detaillierte Erklärung unsichtbarer Indizes in MySQL 8.0

Wort Seit der ersten Version von MySQL 8.0 liegen...

Zusammenfassung der Betriebsaufzeichnungen zum Ändern der MyISAM-Speicher-Engine in Innodb in MySQL

Im Allgemeinen bietet MySQL standardmäßig eine Vi...

Lösung zum Einfügen eines Formulars mit einer Leerzeile oben und unten

Ich weiß nicht, ob Ihnen beim Erstellen einer Webs...

Vue Storage enthält eine Lösung für Boolesche Werte

Vue speichert Speicher mit Booleschen Werten Ich ...

Die JS-Methoden addEventListener() und attachEvent() implementieren Registrierungsereignisse

Im DOM-Ereignismodell von JavaScript werden Ereig...