Kennt ihr den Unterschied zwischen Blockelemente und Inlineelemente und der unterschied zwischen div und span?

... komplette Frage anzeigen

1 Antwort

Die Begriffe "block" und "inline" bzw. die zugehörigen Tags "div" und "span" beziehen sich auf die "Setzung" von Schrift. Das lässt sich am einfachsten vom vertrauten Alltag her erläutern und erst anschließend verallgemeinern...

In unseren europäischen Schriftbildern schreiben wir Texte fortlaufend in Zeilen von links nach rechts und Textzeilen fortlaufend von oben nach unten. Abschnitte innerhalb eines solchen "fortlaufenden" Teils des Textes (oder auch der gesamte fortlaufende Text) werden als "inline" bezeichnet bzw. standardmäßig mit dem HTML-Tag "span" eingeklammert. Ein kompletter solcher Abschnitt von fortlaufendem Text ist immer in einen Rahmen eingelagert, der sich als Rechteck um das gesamte Textkonstrukt legt. Dieser wird als "block" bezeichnet bzw. standardmäßig mit dem HTML-Tag "div" eingeklammert.

Jetzt zur Verallgemeinerung, die uns über mehrere Ebenen führt und schlussendlich alles wieder zu einem austauschbaren Einheitsbrei verquirlt...

Den Umstand, dass Texte in verschiedenen Sprachen und Kulturkreisen in unterschiedlichste Richtungen geschrieben werden (von-links-nach-rechts oder von-rechts-nach-links oder von-oben-nach-unten - lediglich von-unten-nach-oben ist auf diesem Erdball soweit noch nicht favorisiert worden) und auch Textzeilen in unterschiedliche Richtungen geschrieben werden können, stecken wir mal als Nebensächlichkeit in den Skat.

Die erste wesentliche Verallgemeinerung zwischen div uns span besteht darin, dass seit und mit Hilfe von CSS beide völlig beliebig umdefiniert werden können, und somit auch gegenseitig die Rollen tauschen oder zwischendurch auch mal eine Homo-Ehe führen können. In CSS wird das lediglich durch das Attribut "display" festgelegt. Es wird dort also lediglich als eines von vielen visuellen Merkmalen von darzustellenden Elementen behandelt.

Die zweite wesentliche Verallgemeinerung besteht darin, dass dies genauso auf restlos sämtliche sonstigen Elemente von HTML zutrifft, die in einem früheren Stadium von HTML, BEVOR es CSS in seiner ersten Version gab, mal hinsichtlich ihrer "block"/"inline"-Charakteristik vom HTML-Standard festgenagelt gewesen waren. Seit CSS 1 ist das aber völlig nivelliert: Alles kann auf alle Arten dargestellt werden, worunter eben auch der Textfluss und die Zugehörigkeit zum fließenden Text oder alternativ zum Rahmen um Blöcke fließenden Textes fällt.

Die nächste Verallgemeinerung besteht darin, dass alles in allem beliebig geschachtelt sein kann und darf. VOR CSS 1 war das noch nicht der Fall: Damals, in dunklen mittelalterlichen Zeiten der 1990er Jahre, durfte innerhalb von Fließtext kein Block-Element liegen. Was aber auch damals schon nur eine Bedeutung als Layout-Regel für die Browserhersteller hatte, MITNICHTEN aber als Regel für die Schachtelbarkeit von HTML-Inhalten aus Autorensicht galt. Also: Wenn jemand damals ein block-Element in einen inline-Fließtext setzte, hatte der Browser die Aufgabe, den inline-Fließtext selbständig an diesem block-Element aufzuschneiden und zwei selbständige inline-Blöcke draus zu machen, zwischen denen das erwähnte block-Element plaziert zu werden hatte. Seit CSS 1 jedoch hat sich auch diese Regel AN SICH selbst gekillt: Da unter CSS1 alles in allen Varianten dargestellt werden kann und daher auch alles alle Rollen hinsichtlich Fließtext oder Textblockrahmen übernehmen kann, ist es per se völlig unmöglich geworden, aus HTML-Sicht eine Regel irgendeiner Art von Schachtelung aufrechtzuerhalten. Weil die Schachtelbarkeit eben erst im Moment der Darstellung, wenn der Layout-Engine alle augenblicklich (! - dynamisch on-the-fly änderbaren, gelle?!) gelten sollenden CSS-Regeln bekannt sind, hervorgehen kann. Also kurz und gut: Seit CSS 1 sind auch alle Darstellungen, die so im Internet herumfleuchen bezüglich angeblicher Schachtelbarkeit von inline-in-block-aber-nicht-block-in-inline schlicht und ergreifend Nonsense. Wenn es VOR dem Herauskommen von CSS 1 noch auf Dussligkeit zurückgeführt werden konnte, wenn Regelbeschreibungen es so darstellten, als wenn Autoren dafür verantwortlich wären, ist dies seit Herauskommen von CSS 1 durch nichts mehr zu rechtfertigen, auch nicht durch menschliche Ausrutscher.

Allerdings muss man dazu anmerken, dass die Browser- bzw. Layout-Engine-Hersteller selbst zu dem Volk gehören, die Missinterpretationen in die Welt tragen. Mit ihren Produkten.

Während es also völlig selbstverständlich ist, dass man eine "table" verhaltenstechnisch zu einem "span" umdefinieren kann, werden alle Browser bis heute das Schachteln eines beliebigen "inline"-Elements unmittelbar unterhalb eines "table"-Elements als "verboten" behandeln und jenes geschachtelte Element immer hinter das Ende aller eventuell noch tiefer geschachtelt untergebrachten und viel weiter hinten folgenden Tabelleninhalte (tr/td) anhängen. Nur mal als Beispiel, CSS bis heute eben doch nicht das hält, was auf der Verpackung drauf steht.

Antwort bewerten Vielen Dank für Deine Bewertung