Die elementarste Gestaltungsregel für HTML und CSS: Cascading

Einem Wasserfall (Kaskade) gleich, werden Gestaltungsdeklarationen gemäss der Verschachtelung des HTML sowie des CSS vererbt. Daher heisst es auch CSS.

Einzüge im Code

Verschachteln

Einzelne HTML-Elemente werden zu Komponenten von Modulen verschachtelt. Diese Verschachtelung (Nesting) wird auch mit Parent- und Child-Element bezeichnet und steht in einer hierarchischen Abhängigkeit.

Damit die Verschachtelung und die dadurch entstandene Abhängigkeit von Elementen während des Programmierens besser zu erfassen, werden diese Verschachtelungen im Code jeweils eingerückt. HTML-Elemente können unendlich oft ineinander verschachtelt werden.

Dabei gibt es HTML-Elemente, welche sich vorzugsweise um das Layout kümmern. Der Div-Tag oder semantische HTML-Tags beispielsweise.

Diese Verschachtelung definiert die gestalterische Vererbungslogik.

Verschachtelter HTML-Code neben der visuellen Darstellung des gleichen um die Verschachtelung verständlich zu erklären.
© Webdesign Essentials

Rückblende

Anatomie einer Webseite von den Atomen zu dem Organen.

HTML: Semantic Elements: Definiere deine Divs

Kaskade & Vererbung: Einführung

Vertiefe dich ins ganze Kapitel

HTML & CSS Einführung für Designer:innen