Blockelemente vs Inline-Elemente in HTML: Warum die Unterscheidung?

Die Unterscheidung zwischen Block- und Inline-Elementen kam mir immer seltsam vor. Der ganze Unterschied besteht darin, dass ein Blockelement die gesamte Breite einnimmt und so einen Zeilenumbruch vor und nach dem Element erzwingt, und ein Inline-Element nur so viel einnimmt wie der Inhalt. Warum gibt es nicht nur einen Elementtyp - ein Inline-Element, bei dem Sie auch eine benutzerdefinierte Höhe / Breite anwenden und diese verwenden können? Sie möchten Zeilenumbrüche? Fügen Sie ein <br />oder fügen Sie möglicherweise ein spezielles Tag in das CSS für dieses Verhalten ein. So wie es jetzt ist, sehe ich keine Lösung für ein Problem und erzwinge stattdessen nur eine Eigenschaft, die meiner Meinung nach von einem Designer entschieden werden sollte.

Warum also die beiden Typen?

Du sagst:

Sie möchten Zeilenumbrüche? Fügen Sie ein <br />oder fügen Sie möglicherweise ein spezielles Tag in das CSS für dieses Verhalten ein. So wie es jetzt ist, sehe ich kein Problem darin, sondern es erzwingt nur eine Eigenschaft, die meiner Meinung nach von einem Designer entschieden werden sollte.

Sie sind auf dem richtigen Weg - der Stil sollte vom Designer bestimmt werden.

Aber Sie haben das Problem umgekehrt. Das Einfügen eines <br/>Tags ist die Option, mit der "eine Eigenschaft erzwungen wird, die von einem Designer festgelegt werden sollte" - sobald das vorhanden <br/>ist, ist es im Markup-Dokument vorhanden - und nur mit etwas kniffligem CSS kann der Effekt entfernt werden.

Inline / Block elementshingegen sind reine Elemente, die mit einer für den allgemeinen Anwendungsfall geeigneten Standardeinstellung gestaltet sind. Die visuelle Eigenschaft selbst kann sofort von einem CSS-Designer mit display:inlineoder geändert werden display:block.

Nehmen wir zum Beispiel das gemeinsame Element für die Navigation in diesen Tagen <li>. Dies sind standardmäßig blockElemente, aber Designer lassen sie floatinline erscheinen ( blockhaben mehr besondere Eigenschaften als nur die gesamte Zeile aufzunehmen, aber das ist eine Unterhaltung für einen anderen Tag).

Die meisten Elemente haben eine Standardformatierung ... Ihre Frage könnte dahingehend erweitert werden, dass diese Formatierung auch die Entscheidung des Designers sein und entfernt werden sollte. Ich habe immer nur gedacht, dass dies ein Ausgangspunkt ist, und die Formatierung bei Bedarf entfernt (oftmals nicht). Aber am Ende gibt es einige Dinge, die natürlich sind. Wenn Sie beispielsweise einen Absatz haben, erwarten Sie, dass es sich um ein Blockelement handelt, da dies die Art eines Absatzes ist. Unabhängig davon, ob Elemente über Standardeinstellungen wie Block oder Inline verfügen oder nicht, möchte ich auf jeden Fall die Möglichkeit, diese Option anzugeben. Der Grund, warum ich das sage, ist IMO, dass es sauberer ist, Dinge auf diese Weise zu zerbrechen, als a zu werfen<br />im HTML. Macht es das Gleiche? Ja. Mit den jüngsten Fortschritten in HTML konzentrierte sich ein großer Aufwand darauf, die Sprache mehr zu einer semantischen Sprache zu machen, bei der Sie weniger in HTML als in CSS formatieren. Das <br />bedeutet Zeilenumbruch, der sich normalerweise auf einen Zeilenumbruch in einem Absatz oder einem anderen Satz bezieht, der eine Struktur enthält. Am Ende ist es mir egal, aber ich persönlich möchte die Möglichkeit, Block- und Inline-Unterscheidung zu haben, also hoffe ich, dass sie das zumindest nie von der CSS-Seite entfernen!

Das ist so, als würde man sagen, dass es keinen wirklichen Unterschied zwischen Absätzen und Sätzen gibt. Absätze begrenzen eine Gruppe von Ideen. Typischerweise steht ein Satz für eine einzelne Idee.

Das Markup handelt von der Semantik und nicht von der Anzeige. In der Tat kann ein Designer jedes Element, das standardmäßig einen Blockstil verwendet, als Inline-Element behandeln und umgekehrt.

In LaTeX gibt es zwei Modi (ohne Mathematikmodus): den horizontalen und den vertikalen Modus. Die Elemente (Zeichen) sind kleine Kästchen, die sich im Absatz "horizontal" ansammeln. Dann häufen sich diese größeren Kisten vertikal an. Dies ähnelt (X) HTML: Inline und Block.

Klingt für mich nach einem Problem der Abwärtskompatibilität. Das Inline-Element war wahrscheinlich eine spätere Erweiterung des HTML-Standards, und damit Webseiten, die 1992 geschrieben wurden, auch 2011 noch angezeigt werden können, wird es weiterhin unterstützt - als gäbe es eine Tonne von 19 Jahre alten Webseiten ...!

Ich denke, die Anzeigemodi sind zwischen Block und Inline so unterschiedlich, dass sich eine Unterscheidung auf Markup-Ebene lohnt.