The repeating-radial-gradient() function is used to repeat radial gradients. The following example shows how to make a repeating radial gradient:
| HTML file: | Displayed by browser: |
|---|---|
|
<style>
#grad { width:150px; height:200px; /* For Safari 5.1 to 6.0 */ background: -webkit-repeating-radial-gradient(red, yellow 10%, green 15%); /* For Opera 11.6 to 12.0 */ background: -o-repeating-radial-gradient(red, yellow 10%, green 15%); /* For Firefox 3.6 to 15 */ background: -moz-repeating-radial-gradient(red, yellow 10%, green 15%); /* Standard syntax */ background: repeating-radial-gradient(red, yellow 10%, green 15%); } </style> <body> <p>Repeating Radial Gradient</p> <div id="grad"></div> </body> |
Repeating Radial Gradient |
Note: Internet Explorer 9 and earlier versions do not support gradients.
