CSS repeating-radial-gradient() fonksiyonu

Tanım ve kullanım

CSS tekrarlayan-radyal-gradyent() Tekrar eden radyal eğim için fonksiyon kullanılır.

Radyal eğim	Tekrar eden radyal eğim

radial-gradient(red, yellow, green);	repeating-radial-gradient(red, yellow 10%, green 15%);

Bir tekrar eden radyal eğim:

#grad {
  background-image: tekrarlayan-radyal-gradyent(kırmızı, sarı 10%, yeşil 15%);
}

Şekil boyutları ve konum ayarlanan bir diğer tekrarlayan radyal gradyan:

#grad1 {
  background-image: tekrarlayan-radyal-gradyent(ellipse en-uzak-köşe 25% 25%, kırmızı, sarı 10%, yeşil 15%);
}

İki renk bitiş noktası ayarlanan bir diğer tekrarlayan radyal gradyan:

#grad1 {
  background-image: tekrarlayan-radyal-gradyent(kırmızı 0% 10%, sarı 11% 21%, yeşil 22% 32%);
}

tekrarlayan-radyal-gradyent(shape size at position, start-color, ... , last-color);

değer	tanım
shape	Gradyan şeklini tanımlar. Olası değerler: ellipse (varsayılan) circle
size	Gradyan boyutunu tanımlar. Olası değerler: en-uzak-köşe (varsayılan) en-yakın-yan en-yakın-köşe en-uzak-yan
at position	Gradyan konumunu tanımlar. varsayılan değeri "merkez"tir.
start-color, ... , last-color	Renk bitiş noktaları, arasında pürüzsüz geçiş görmek istediğiniz renklerdir. Bu değer, renk değerlerinden ve bir veya iki seçmeli durak noktasından oluşur (0% ile 100% arasındaki yüzdelik veya gradyan eksenindeki uzunluk).