repeating-radial-gradient funktsiyasi

repeating-radial-gradient funktsiyasi takrorlanuvchi radial gradientni belgilaydi. Bu shuni anglatadiki, biz gradientning ma'lum bir naqshini belgilaymiz, masalan, 0px dan 10px gacha - qizildan havorangga gradient va bu gradient butun blok bo'ylab takrorlanadi: 0px dan 10px gacha, 10px dan 20px gacha, 20px dan 30px gacha va hokazo.

Funktsiya radial-gradient bilan bir xil parametrlar bilan ishlaydi, farq faqat takrorlanish effektida. Qabul qilinadigan parametrlarni radial-gradient tavsifida ko'ring.

Sintaksis

selektor {
	background: repeating-radial-gradient([shakl turi joylashuvi], rang1 hajm1, rang2 hajm2...);
}

Misol

Markaziy doiralar:

<div id="elem"></div>

#elem {
	background: repeating-radial-gradient(circle at center, red 0px, red 2px, white 2px, white 4px);
	width: 400px;
	height: 200px;
}

Misol

Markaziy ellipslar:

<div id="elem"></div>

#elem {
	background: repeating-radial-gradient(ellipse at center, red 0px, red 4px, white 4px, white 8px);
	width: 400px;
	height: 200px;
}

Misol

Markaziy doiralarni markazda emas, balki chetda joylashtiramiz:

<div id="elem"></div>

#elem {
	background: repeating-radial-gradient(circle at 50px 100px, red 0px, red 2px, white 2px, white 4px);
	width: 400px;
	height: 200px;
}

Shuningdek qarang

repeating-linear-gradient funktsiyasi,
bu takrorlanuvchi chiziqli gradient yaratadi
linear-gradient funktsiyasi,
bu chiziqli gradient yaratadi
radial-gradient funktsiyasi,
bu radial gradient yaratadi