mozilla

Compare Revisions

repeating-radial-gradient()

Change Revisions

Revision 461843:

Revision 461843 by FredB on

Revision 461845:

Revision 461845 by FredB on

Title:
repeating-radial-gradient
repeating-radial-gradient
Slug:
Web/CSS/repeating-radial-gradient
Web/CSS/repeating-radial-gradient
Tags:
"NeedsLiveSample", "css", "css3-images", "CSS Reference", "CSS Référence"
"NeedsLiveSample", "css", "css3-images", "CSS Reference", "CSS Référence"
Content:

Revision 461843
Revision 461845
t239    <div style="background: -webkit-repeating-radial-gradient(ellt239    <h3>
>ipse farthest-corner, red, black 5%, blue 5%, green 10%); backgro 
>und: -moz-repeating-radial-gradient(ellipse farthest-corner, red, 
> black 5%, blue 5%, green 10%);background: -ms-repeating-radial-g 
>radient(ellipse farthest-corner, red, black 5%, blue 5%, green 10 
>%);background: -o-repeating-radial-gradient(ellipse farthest-corn 
>er, red, black 5%, blue 5%, green 10%);background: repeating-radi 
>al-gradient(ellipse farthest-corner, red, black 5%, blue 5%, gree 
>n 10%); text-shadow: 1px 1px 0pt blue; color: white; border: 1px  
>solid black;height:5.5em;"> 
240      farthest corner240      Farthest-corner
241    </div>241    </h3>
242    <pre class="brush: html" style="display:none;">
243&lt;div id="grad1"&gt;Farthest-corner&lt;/div&gt;
244</pre>
245    <pre class="brush: css" style="display:none;">
246div {
247  display: block;
248  width: 50%;
249  height: 80px;
250  border-radius: 10px;
251  border-color: #000000;
252  padding: 10px;
253}
254#grad1 {
255  background: -webkit-repeating-radial-gradient(ellipse farthest-
 >corner, red, black 5%, blue 5%, green 10%);
256  background: -moz-repeating-radial-gradient(ellipse farthest-cor
 >ner, red, black 5%, blue 5%, green 10%);
257  background: -ms-repeating-radial-gradient(ellipse farthest-corn
 >er, red, black 5%, blue 5%, green 10%);
258  background: -o-repeating-radial-gradient(ellipse farthest-corne
 >r, red, black 5%, blue 5%, green 10%);
259  background: repeating-radial-gradient(ellipse farthest-corner, 
 >red, black 5%, blue 5%, green 10%);
260  text-shadow: 1px 1px 0pt blue;
261  color: white;
262  border: 1px solid black;
263  height:5.5em;
264}
265</pre>
242    <pre>266    <p>
267      {{ EmbedLiveSample('Farthest_corner', '300px', '120px', '')
 > }}
268    </p>
269    <pre class="brush: css">

Back to History