ฟังก์ชัน repeating-radial-gradient() สร้างลายเส้นแบบรัศมีซ้ำๆ (concentric rings pattern) โดยอัตโนมัติจาก color-stop ที่กำหนด
ตัวอย่างโค้ด
<!DOCTYPE html>
<html>
<head>
<style>
#demo {
height: 300px;
background: repeating-radial-gradient(green 20%, orange 40%, maroon 40%);
}
</style>
</head>
<body>
<p>Repeating radial gradient</p>
<div id="demo"></div>
</body>
</html>
วิธีการทำงาน: ไล่สีจากศูนย์กลาง: เขียว (0-20%) ส้ม (20-40%) มารูน (40%) แล้ววนซ้ำรูปแบบเดิมในรัศมีถัดไป สร้างลายแหวนเกนซ้ำ (target pattern)
รูปแบบไวยากรณ์เต็ม:
repeating-radial-gradient(shape size at position, color-stop-list)
การประยุกต์: สร้างพื้นหลังลายแหวน, loading spinner background, decorative pattern แทนรูปภาพ
