Erklärung des HTML-Codes der Webseite: geordnete Liste und ungeordnete Liste

In diesem Abschnitt lernen wir Listenelemente in HTML kennen. Listen machen einen relativ großen Anteil im Website-Design aus. Sie stellen Informationen sehr übersichtlich und intuitiv dar und sind für Benutzer leicht verständlich. Im anschließenden CSS-Style-Lernen werden die erweiterten Funktionen von Listenelementen ausführlich genutzt.
Listen zum Organisieren von Daten <br />Nachdem die Leser so viele HTML-Tags kennengelernt haben, die die Anzeige von Webseiten steuern, können sie mit der Erstellung reiner Artikelseiten beginnen. In diesem Abschnitt lernen wir Listenelemente in HTML kennen. Listen machen einen relativ großen Anteil im Website-Design aus. Sie stellen Informationen sehr übersichtlich und intuitiv dar und sind für Benutzer leicht verständlich. Im anschließenden CSS-Style-Lernen werden die erweiterten Funktionen von Listenelementen ausführlich genutzt.
Textfeld: Abbildung 4.17 Aufbau der Listenelemente

Textfeld: Abbildung 4.17 Aufbau der Listenelemente

4.4.1 Listenstruktur
Das HTML-Listenelement ist eine von einem Listen-Tag umschlossene Struktur und die enthaltenen Listenelemente bestehen aus <li></li>. Der konkrete Aufbau ist in Abbildung 4.17 dargestellt.
4.4.2 Ungeordnete Liste erstellen <br />Wie der Name schon sagt, ist eine ungeordnete Liste eine Listenstruktur, in der die Listenelemente keine Reihenfolge aufweisen. Die meisten Listen in Webanwendungen verwenden ungeordnete Listen und ihre Listen-Tags verwenden <ul></ul>. Die Schreibweise ist wie folgt:
<ul>
<li>Listenelement 1</li>
<li>Listenelement 2</li>
<li>Listenpunkt Drei</li>
<li>Listenpunkt vier</li>
<li>Listenpunkt fünf</li>
</ul>
4.4.3 Eine geordnete Liste erstellen <br />Eine geordnete Liste ist, wie der Name schon sagt, eine Listenstruktur, bei der die Listenelemente eine bestimmte Reihenfolge haben. Dabei können von oben nach unten verschiedene Ordnungszahlen vorkommen, wie etwa 1, 2, 3 oder a, b, c, usw. Erstellen Sie eine Webseitendatei im Verzeichnis D:\web\, nennen Sie sie ul_ol.htm und schreiben Sie den Code wie in Code 4.17 gezeigt.
Listeneinstellungen: ul_ol.htm
<html>
<Kopf>
<title>Listeneinstellungen</title>
</Kopf>
<Text>
<Schriftgröße="5">
Web-Frontend-Technologie
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>BLITZ</li>
</ul>
Web-Backend-Lernen
<ol>
<li>ASP</li>
<li>ASP.net</li>
<li>PHP</li>
<li>CGI</li>
Rubin
Python
</ol>
</font>
</body>
</html>
Geben Sie http://localhost/ul_ol.htm in die Adressleiste des Browsers ein. Der Browsing-Effekt wird in Abbildung 4.18 angezeigt.

Abbildung 4.18 Listeneinstellungen

<<: Vue macht Div-Höhe verschiebbar

>>: Detailliertes Beispiel für die Verkettung mehrerer Felder in MySQL

Implementierung von HTTP- und HTTPS-Diensten mit Nginx-Reverse-Proxy für mehrere Domänennamen

Erste Schritte beim Erstellen einer Website für Anfänger - Die Voraussetzungen und Tools, die zum Erstellen einer Website erforderlich sind

Artikel

So mounten Sie die Datenfestplatte nach dem Initialisieren der Systemfestplatte in Linux erneut

Zusammenfassung der in MySQL häufig verwendeten SQL-Anweisungen zum Erstellen von Tabellen, Hinzufügen von Feldern, Ändern von Feldern und Hinzufügen von Indizes

Dieser Artikel beschreibt anhand von Beispielen d...

Erklärung des HTML-Codes der Webseite: geordnete Liste und ungeordnete Liste

Implementierung von HTTP- und HTTPS-Diensten mit Nginx-Reverse-Proxy für mehrere Domänennamen

Detaillierte Erläuterung der Vue-Projektverpackung

js+canvas realisiert Code-Regeneffekt

Erste Schritte beim Erstellen einer Website für Anfänger - Die Voraussetzungen und Tools, die zum Erstellen einer Website erforderlich sind

So mounten Sie die Datenfestplatte nach dem Initialisieren der Systemfestplatte in Linux erneut

Beispielcode für die Vue-Bildzuschneidekomponente

So stellen Sie die LNMP-Architektur im Docker bereit

Detaillierte Erläuterung des Problems der gemischten Verwendung von Limit- und Summenfunktionen in MySQL

Implementierung von Debugging-Code über den Nginx-Reverse-Proxy

Vue implementiert die Anmeldung per Mobiltelefon-Bestätigungscode

Artikel empfehlen

Lassen Sie uns über die Leistung von MySQLs COUNT(*) sprechen.

So setzen Sie das Root-Passwort in CentOS7 zurück

jQuery implementiert die Formularvalidierung

Implementierung der Funktion der kreisförmigen prozentualen Fortschrittsbalkenkomponente von Vue

Docker-Container sichert regelmäßig die Datenbank und sendet sie an das angegebene Postfach (Designidee)

Beispielcode zur Implementierung eines gestapelten Karusselleffekts mit HTML+CSS+JS

Natives JS zum Erzielen von Jalousie-Spezialeffekten

Wie MySQL implizite Standardwerte verarbeitet

Methoden und Schritte für den Zugriff auf die Baidu Maps API mit JavaScript

Zusammenfassung der in MySQL häufig verwendeten SQL-Anweisungen zum Erstellen von Tabellen, Hinzufügen von Feldern, Ändern von Feldern und Hinzufügen von Indizes

Farben werden in HTML durch 6-stellige Hexadezimalcodes, RGB oder Schlüsselwörter dargestellt.

Keepalived implementiert Nginx-Lastausgleich und Beispielcode für hohe Verfügbarkeit

Detaillierte Erläuterung der grundlegenden Docker-Netzwerkkonfiguration

CSS3 Milchglaseffekt

Detaillierte Erklärung des Loop-Formularelementbeispiels in Vue