Funksioni repeating-radial-gradient
Funksioni repeating-radial-gradient
përcakton një gradiënt radial përsëritës.
Kjo do të thotë që ne përcaktojmë një model të caktuar
të gradiëntit, për shembull, nga 0px deri në 10px
- gradiënt nga e kuqja në të kaltër dhe ky
gradiënt do të përsëritet në të gjithë bllokun:
0px deri në 10px, nga 10px
deri në 20px, nga 20px deri në 30px
e kështu me radhë.
Funksioni punon me të njëjtat parametra si
radial-gradient,
ndryshimi është vetëm në efektin e përsëritjes. Parametrat
e pranuar shikoni në përshkrimin e radial-gradient.
Sintaksë
selektor {
background: repeating-radial-gradient([formë lloj pozicion], ngjyra1 madhësia1, ngjyra2 madhësia2...);
}
Shembull
Rrathë koncentrikë:
<div id="elem"></div>
#elem {
background: repeating-radial-gradient(circle at center, red 0px, red 2px, white 2px, white 4px);
width: 400px;
height: 200px;
}
:
Shembull
Elipse koncentrike:
<div id="elem"></div>
#elem {
background: repeating-radial-gradient(ellipse at center, red 0px, red 4px, white 4px, white 8px);
width: 400px;
height: 200px;
}
:
Shembull
Të vendosim rrathë koncentrikë jo në qendër, por në anë:
<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;
}
:
Shihni gjithashtu
-
funksionin
repeating-linear-gradient,
që krijon një gradiënt linear përsëritës -
funksionin
linear-gradient,
që krijon një gradiënt linear -
funksionin
radial-gradient,
që krijon një gradiënt radial