फ़ंक्शन repeating-radial-gradient

फ़ंक्शन repeating-radial-gradient एक दोहराव वाला रेडियल ग्रेडिएंट सेट करता है। इसका मतलब है कि हम ग्रेडिएंट का एक निश्चित पैटर्न सेट करते हैं, उदाहरण के लिए, 0px से 10px तक - लाल से नीले रंग में ग्रेडिएंट और यह ग्रेडिएंट पूरे ब्लॉक में दोहराया जाएगा: 0px से 10px, 10px से 20px तक, 20px से 30px तक और इसी तरह आगे भी।

फ़ंक्शन उन्हीं पैरामीटर्स के साथ काम करता है, जो radial-gradient के साथ हैं, अंतर केवल दोहराव के प्रभाव में है। स्वीकृत पैरामीटर्स radial-gradient के विवरण में देखें।

सिंटैक्स

सिलेक्टर {
	background: repeating-radial-gradient([आकृति प्रकार स्थिति], रंग1 आकार1, रंग2 आकार2...);
}

उदाहरण

संकेंद्रित वृत्त:

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

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

उदाहरण

संकेंद्रित दीर्घवृत्त:

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

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

उदाहरण

संकेंद्रित वृत्तों को केंद्र में नहीं, बल्कि किनारे पर रखें:

<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;
}

यह भी देखें

फ़ंक्शन repeating-linear-gradient,
जो एक दोहराव वाला लीनियर ग्रेडिएंट बनाता है
फ़ंक्शन linear-gradient,
जो एक लीनियर ग्रेडिएंट बनाता है
फ़ंक्शन radial-gradient,
जो एक रेडियल ग्रेडिएंट बनाता है