CSS/Funktionen/repeating-radial-gradient()

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

Parameter	siehe radial-gradient()
anwendbar auf	background-image, border-image, list-style-image, mask-image
Browsersupport	caniuse: css-gradients

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.

Weblinks

• W3C: Radial Gradients: the repeating-radial-gradient() notation
• MDN: repeating-radial-gradient()

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