CSS/Funktionen/repeating-radial-gradient()

Browserunterstützung
caniuse.com

Die CSS-Funktion repeating-radial-gradient() legt einen sich wiederholenden radialen Farbverlauf fest

anwendbar auf

background-image, border-image, list-style-image, mask-image

Parameter

siehe radial-gradient()

Beispiel

body {
  background: 
    repeating-radial-gradient(black, black 5px, white 5px, white 10px);
  height: 85vh;
}

 

Empfehlung: Denselben Effekt erreichen Sie auch durch die Kombination von background-size und background-repeat. Gegebenfalls muss die Höhe fest vorgegeben werden oder auf andere Einheiten wie vh bzw. vw ausgewichen werden.

Siehe auch

• CSS/Tutorials/Hintergrund/Verläufe
  • repeating-radial-gradient()
• Tricks mit border-image Rahmen mit Verlauf
• Masken und Beschneidungen/Masken
  • mask-image Teiltransparente Bereiche

Weblinks

• W3C: Radial Gradients: the repeating-radial-gradient() notation
• MDN: repeating-radial-gradient()
• Browser-Support: caniuse.com