Ohne die Hilfe von CSS werden Blockelemente jeweils zeilenweise angeordnet. Mit CSS können wir den Standardlayoutmodus dieses HTML ändern und die Blockelemente an der gewünschten Stelle platzieren. Anstatt jedes Mal dummerweise eine neue Zeile zu beginnen. Es sollte darauf hingewiesen werden, dass das Tabellen-Tag auch eine Art Blockelement ist. Betrachten Sie diese beiden Layouts aus der Perspektive normaler Benutzer (mit Ausnahme von sehbehinderten Personen, blinden Personen usw.). Abgesehen vom Unterschied gibt es keinen weiteren Unterschied. Wenn ein normaler Benutzer jedoch versehentlich auf die Schaltfläche „Quellcode der Seite anzeigen“ klickt, ist der Unterschied zwischen beiden sehr groß. Der auf guten Rekonstruktionskonzepten basierende CSS-Layout-Seitenquellcode kann es zumindest normalen Benutzern ohne Erfahrung in der Webentwicklung ermöglichen, den Inhalt schnell zu verstehen. Aus dieser Perspektive sollte CSS-Layoutcode ein besseres ästhetisches Erlebnis haben.

Sie können sich das Blockcontainerelement div als Kästchen vorstellen, oder wenn Sie mit dem Ausschneiden experimentiert haben, wird es einfacher zu verstehen sein. Wir haben zunächst die benötigten Artikel aus verschiedenen Zeitungen und Zeitschriften ausgeschnitten. Jeder ausgeschnittene Inhalt ist ein Block. Anschließend haben wir diese Papierstücke entsprechend unserer Layout-Intention auf ein neues Blatt leeres Papier geklebt. Dadurch entsteht Ihre eigene, einzigartige Zusammenfassung. Als Erweiterung der Technologie folgt das Weblayout-Design demselben Muster.

Inline-Elemente basieren im Allgemeinen auf Basiselementen auf semantischer Ebene. Inline-Elemente können nur Text oder andere Inline-Elemente enthalten, und das gemeinsame Inline-Element „a“ ist dies.

Blockelement (Blockelement) und Inline-Element (Inline-Element) sind Konzepte in der HTML-Spezifikation. Der grundlegende Unterschied zwischen Blockelementen und Inline-Elementen besteht darin, dass Blockelemente im Allgemeinen in einer neuen Zeile beginnen. Wenn die CSS-Steuerung hinzugefügt wird, wird dieser Attributunterschied zwischen Blockelementen und Inline-Elementen nicht mehr zu einem Unterschied. Beispielsweise können wir dem Inline-Element cite ein Attribut wie display:block hinzufügen, sodass es auch das Attribut hat, jedes Mal in einer neuen Zeile zu beginnen.
Das Grundkonzept eines veränderlichen Elements besteht darin, dass es anhand des Kontexts bestimmen muss, ob es sich bei dem Element um ein Blockelement oder ein Inline-Element handelt. Variable Elemente gehören weiterhin zu den beiden oben genannten Elementkategorien. Sobald der Kontext ihre Kategorie bestimmt, müssen sie den Regeln von Blockelementen oder Inline-Elementen folgen. Eine grobe Elementklassifizierung finden Sie im Volltext.

ps: In Bezug auf den chinesischen Namen des Inline-Elements gibt es viele Arten von Inline-Elementen, Inline-Elementen, Inline-Elementen und Inline-Elementen. Grundsätzlich gibt es keine einheitliche Übersetzung. Nennen Sie sie einfach wie Sie möchten. Wenn wir über Inline-Elemente sprechen, denken wir außerdem an ein Anzeigeattribut namens display:inline. Dieses Attribut kann das berühmte IE-Problem mit dem doppelten schwebenden Rand (Float-Marge) beheben.
Blockelement
* Adresse - Adresse
* Blockzitat – Blockzitat
* Mitte - Mittenausrichtungsblock
* dir – Verzeichnisliste
* div – häufig verwendete Blockebene ist auch das Haupt-Tag des CSS-Layouts
* dl – Definitionsliste
* Fieldset – Formularkontrollgruppe
* Formular – interaktives Formular
* h1 – Überschrift
* h2 - Untertitel
*h3 – Überschrift der Ebene 3
*h4 – Überschrift der Stufe 4
*h5 – Überschrift der Stufe 5
*h6 – Überschrift der Stufe 6
*hr – horizontaler Teiler
* isindex – Eingabeaufforderung
*Menü – Menüliste
* noframes – Frames optionaler Inhalt (zeigt diesen Blockinhalt für Browser an, die keine Frames unterstützen).
*noscript -) Optionaler Skriptinhalt (zeigt diesen Inhalt für Browser an, die kein Skript unterstützen)
*ol – Sortierform
* p - Absatz
* vorformatierter Text
* Tisch - Tisch
* ul – unsortiertes Listen-Inline-Element (Inline-Element)
* a - Ankerpunkt
*abbr – Abkürzung
*Akronym – Anfangswort
* b – fett (nicht empfohlen)
* bdo – Bidi-Überschreibung
* groß – große Schriftart
* br - Zeilenumbruch
*zitieren – zitieren
* Code – Computercode (erforderlich bei Angabe des Quellcodes)
* dfn – Felder definieren
*em – Betonung
* Schriftart - Schriftarteinstellungen (nicht empfohlen)
* i – kursiv
* img - Bild
* Eingabe - Eingabefeld
* kbd – Tastaturtext definieren
* Etikett – Tabellenetikett
*q – kurzes Zitat
* s – Bindestrich (nicht empfohlen)
* samp – definiert Beispielcomputercode
* auswählen - Artikelauswahl
* klein – kleiner Schrifttext
* span – häufig verwendeter Inline-Container zum Definieren von Blöcken innerhalb von Text
* Schlag – Mittellinie
*strong – Fette Hervorhebung
* sub - tiefgestellt
* sup – hochgestellt
* textarea – mehrzeiliges Texteingabefeld
*tt – Telextext
* u - Unterstrich
* var – definiert eine Variable. Variables Element – ​​ein variables Element ist je nach Kontext ein Blockelement oder ein Inline-Element.
* Applet – Java-Applet
* Taste - Taste
* del – Text löschen
* iframe – Inline-Frame
* ins – eingefügter Text
* Karte - Bildblock (Karte)
* Objekt - Objektobjekt
* Skript – Client-Skript