Hintergrundeffekte mit border-image

Mit den Rahmenbildeigenschaften der border-image-Eigenschaft kann man ein Bild festlegen, das – in Einzelteile zerlegt – in den Rahmenbereichen eines Elements angezeigt wird. Bevor es border-radius gab, wurden so „runde Ecken“ erzeugt. Noch interessanter ist es aber, vom Browser erzeugte Verläufe für vielfältige visuelle Zwecke zu verwenden.

border-image mit Verlauf

Wenn man die border-image-slice-Eigenschaft mit dem Schlüsselwort fill verwendet, kann der von CSS erzeugte Gradient über die gesamte Fläche gezeichnet werden, anders als bei Background-image kann aber die Breite über das Element herausragen!

SELFHTML

SELFHTML bietet seit 1995 eine Dokumentation zu allem rund um HTML (und ab 1997) auch zu CSS. Mittlerweile gibt es über 300 CSS-Eigenschaften in unserem Wiki!

Hilf mit das SELFHTML-Projekt aktuell zu halten und zu verbessern!