Rahmen und Ribbons

Ribbons

Unter einem Ribbon (engl. für Band) versteht man einen farbig abgesetzten Hintergrund, meist für eine Überschrift oder ein Zitat.

Die h1-Überschrift wird mit einem Band hinterlegt, das um den linken Rand des Texts geknickt wird. Dafür wird ein Pseudoelement links unter die Überschrift gelegt.

Die aside-Boxen erhalten einen gestrichelten Rand in Akzentfarbe und ihre h2-Überschriften ein Ribbon mit zwei Pseudoelementen.

CSS-basierte Grid Layouts

Grid Layout ist wie Flexbox eine sehr moderne und einfache Möglichkeit, responsive und flexible Layouts zu erstellen, ohne feste Größenangaben und weitere CSS-Einstellungen wie position, float oder clear nutzen zu müssen.

Grid Layout wird in allen modernen Browsern unterstützt.