Block- und Zeilenelemente, Sonderzeichen und Verschachtelungsregeln in HTML

Wenn wir die Verschachtelungsregeln grundlegender HTML-Webseiten-Tags einführen, müssen wir zuerst über die Klassifizierung von Elementen sprechen. Elemente können in Blockebenenelemente und Zeilenebenenelemente unterteilt werden. Was sind Blockebenenelemente? Es kann eine einzelne Zeile einnehmen und Sie können die Breite und Höhe festlegen, der Standardwert ist 100 %; beim Element auf Zeilenebene ist es das Gegenteil, sein Inhalt bestimmt seine Breite und Höhe und Sonderzeichen werden als Text behandelt.

<!DOCTYPE html>
<html lang="de">
<Kopf>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
    <title>HTML-Blockebene, Elemente auf Zeilenebene, Sonderzeichen, Verschachtelungsregeln</title>
</Kopf>
<Text>
    <!-- Blockelement: nimmt eine einzelne Zeile ein, Breite und Höhe können eingestellt werden, Standardbreite ist 100 % -->
    Blockelemente werden in Text- und Containertypen unterteilt. Textblockelemente: p, h1-h6
    Containerblockelemente: div, table, tr, td, frame, ul>li, ol, dl, dt, dd (Sequenz)
    <!-- Zeilenelement: belegt keine einzelne Zeile, Breite und Höhe richten sich nach dem Inhalt-->
    Zeilenelement: a img input strong em del span
    Sonderzeichen: Literal br &nbsp hr
</body>
</html>

Die Verschachtelungsregeln lassen sich wie folgt zusammenfassen:

1. Blockelemente können in Zeilenelementen verschachtelt werden

2. Zeilenelemente können innerhalb von Zeilenelementen verschachtelt werden

3. Zeilenelemente können nicht in Blockelementen verschachtelt werden

4. Textblockelemente können nicht in Blockelementen verschachtelt werden

5. Containerblockelemente können Blockelemente verschachteln

Die folgenden Blogbeiträge zu den Grundkonzepten von HTML-Webseiten, der Grundstruktur von HTML-Webseiten, der Einführung in grundlegende HTML-Tags, Bilder, Text, Hyperlinks, Listen, Tabellen, die interaktiven Prinzipien grundlegender HTML-Tags, Optionsfelder, Kontrollkästchen, Dropdown-Felder und der Vergleich zwischen dem DIV+CSS-Layout von Webseiten und dem traditionellen ifame-Layout sind allesamt Teile von HTML. Der Hauptzweck des Erlernens von HTML besteht darin, seine semantischen Verschachtelungsregeln zum Erstellen von Seiten zu verstehen. Was das CSS und die interaktive Logik JS der Seite betrifft, so sind dies die Inhalte, die im Folgenden geübt werden sollen!

<<: So zeigen Sie den Prozentsatz und die ersten paar Prozent in MySQL an

>>: So legen Sie die Position des Blockelements in der Mitte des Fensters fest

Tutorial zur Verwendung von Portainer zum Herstellen einer Verbindung mit einem Remote-Docker

Block- und Zeilenelemente, Sonderzeichen und Verschachtelungsregeln in HTML

Tutorial zur Verwendung von Portainer zum Herstellen einer Verbindung mit einem Remote-Docker

25 Beispiele für Website-Design im Nachrichtenstil

Implementierungscode für die Sicherung und Wiederherstellung von MySQL-Datenbanken

Bei der SQL-Optimierung treten häufig Fehler auf, weil Sie die Verwendung von MySQL nicht verstehen.

Verständnis und Anwendungsszenarien von Enumerationstypen in TypeScript

CSS zum Erstellen eines dynamischen sekundären Menüs

Lösen Sie das Problem der Angabe der UDP-Portnummer im Docker

Vue erzielt einen nahtlosen Karusselleffekt (Laufschrift)

Pygame-Code zum Erstellen eines Schlangenspiels

So lassen Sie eine Remoteverbindung in MySql zu

Artikel empfehlen

Einführung in die Stammverzeichniserweiterung unter Linux

Vue realisiert die Bildschirmanpassung von Großbildschirmseiten

Lösungen für das Problem der Erstellung von XHTML- und CSS-Webseiten

Detaillierte Bereitstellung von Docker+Gitlab+Gitlab-Runner

Eine Sammlung von Informationen zu Formularen und Formularübermittlungsvorgängen in HTML

Verwenden von js zum Implementieren der bidirektionalen Bindungsfunktion von Daten in Vue2.0

Nexus verwendet Nginx-Proxy zur Unterstützung des HTTPS-Protokolls

Nginx-Lastausgleichskonfiguration, automatischer Umschaltmodus bei Ausfallzeiten

Farbverlauf für HTML-Hintergrund durch CSS erreicht

Vue implementiert eine Komponente zur dynamischen Abfrageregelgenerierung

So erhalten Sie USB-Scannerdaten mit js

Stil-Trigger-Effekt des Webseiten-Eingabefelds

Einführung in die wichtigsten Browser und ihre Kernel

Grafisches Tutorial zur Installation und Konfiguration von mysql5.7.19 winx64 (win10)

Eine kurze Diskussion über 12 klassische Probleme in Angular