CSS Paint Worklet: Individuelle Hintergrundbilder gestalten

Dieses Beispiel zeigt, wie man dynamische Hintergrundbilder mit CSS Paint Worklet erstellt. Durch die Definition der benutzerdefinierten Eigenschaften `--boxColor` und `--widthSubtractor` und die Verwendung des CSS-Selectors `nth-of-type` generieren wir Hintergrundbilder mit verschiedenen Farben und Breiten für Listenelemente. Das JavaScript registriert ein externes Paint-Worklet-Skript, `boxbg.js`, das die Logik zum Zeichnen des Hintergrunds enthält. Das Endergebnis ist anpassbar; ändern Sie die Werte der benutzerdefinierten Eigenschaften in den Entwicklertools, um Farben und Breiten zu ändern.