Funksiya repeating-radial-gradient

Funksiya repeating-radial-gradient təkrarlanan radial qradiyenti təyin edir. Bu o deməkdir ki, biz qradiyentin müəyyən bir nümunəsini təyin edirik, məsələn, 0px-dən 10px-ə qədər - qırmızıdan maviyə qradiyent və bu qradiyent bütün blok boyunca təkrarlanacaq: 0px-dən 10px-ə qədər, 10px-dən 20px-ə qədər, 20px-dən 30px-ə qədər və s.

Funksiya radial-gradient ilə eyni parametrlərlə işləyir, fərq yalnız təkrarlama effektindədir. Qəbul edilən parametrlərə radial-gradient-in təsvirində baxın.

Sintaksis

selektor {
	background: repeating-radial-gradient([forma tip mövqe], reng1 ölçü1, reng2 ölçü2...);
}

Nümunə

Koncentrik dairələr:

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

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

Nümunə

Koncentrik ellipslər:

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

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

Nümunə

Koncentrik dairələri mərkəzdə yox, kənarda yerləşdirək:

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

Həmçinin bax

funksiyanı repeating-linear-gradient,
hanisi təkrarlanan xətti qradiyent yaradır
funksiyanı linear-gradient,
hanisi xətti qradiyent yaradır
funksiyanı radial-gradient,
hanisi radial qradiyent yaradır