CSS repeating-conic-gradient() funktion

Definition och användning

CSS repeating-conic-gradient() Funktionen används för att upprepa konisk gradient.

Konisk gradient	Upprepad konisk gradient

koniskgradient(red, yellow);	repeating-conic-gradient(red 10%, yellow 20%);

En upprepande konisk gradient:

#grad {
  background-image: repeating-conic-gradient(red 10%, yellow 20%);
}

En upprepande konisk gradient som definierar färgstart- och slutpunkter:

#grad {
  background-image: repeating-conic-gradient(red 0 30deg, yellow 30deg 60deg, blue 60deg 90deg);
}

En annan upprepande konisk gradient med specificerad startvinkel och mittenposition:

#grad1 {
  background-image: repeating-conic-gradient(from 10deg at 30% 30%, red 0 30deg, yellow 30deg 60deg, blue 60deg 90deg);
}

repeating-conic-gradient([från vinkel] position,] färggrader, färggrader, ...);

Värde	Beskrivning
från vinkel	Valfritt. Hel konisk gradient roteras med denna vinkel. Standardvärdet är 0deg.
vid position	Valfritt. Specificera mittenpunkten för konisk gradient. Standardvärdet är center.
färggrader, ... , färggrader	Färgens slutpunkt är den färg som du vill ha en smidig övergång mellan. Detta värde består av färgvärden och ett eller två valfria stopplinjer (vinkel mellan 0 och 360 grader eller mellan 0% och 100%)

Värde

Beskrivning

från vinkel

Valfritt. Hel konisk gradient roteras med denna vinkel.

Standardvärdet är 0deg.

vid position

Valfritt. Specificera mittenpunkten för konisk gradient.

Standardvärdet är center.

färggrader, ... , färggrader

Färgens slutpunkt är den färg som du vill ha en smidig övergång mellan.

Detta värde består av färgvärden och ett eller två valfria stopplinjer (vinkel mellan 0 och 360 grader eller mellan 0% och 100%)