Функсияи hue-rotate

Функсияи hue-rotate имкон медиҳад, ки рангнокӣ тасвири заминаро бо гардиши ранг дар доираи рангҳо тағйир диҳад. Қиматҳои хусусият дар дараҷаҳо муайян карда мешаванд, ки кунҷи доираи рангро ифода мекунанд. Қимати 0 ё 360 ифода мекунад, ки тасвир бе тағйир боқӣ мемонад, ва ҳар адади дар дохили ин диапазон ҷойгиршуда ба тағйири рангнокии замина оварда расонад. Ба таври пешфарз қимат баробар аст 0deg.

Синтаксис

интихобкунанда {
	filter: hue-rotate(кунҷ);
}

Намуна

Биёед барои тасвири мо рангнокӣ баробар ба 150deg муқаррар кунем:

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

#elem {
	filter: hue-rotate(150deg);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Намуна

Ҳоло рангнокии тасвирро баробар ба 50deg муқаррар мекунем:

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

#elem {
	filter: hue-rotate(50deg);
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Намуна

Биёед дар хусусияти hue-rotate қиматро муқаррар накунем:

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

#elem {
	filter: hue-rotate();
	background: url("bg.png") center / cover no-repeat;
	width: 400px;
	height: 300px;
	border: 1px solid black;
}

Ҳамчунин нигаред

функсияи blur,
ки заминаро тоза мекунад
функсияи brightness,
ки равшаниро ба замина медиҳад
функсияи contrast,
ки контрастиятиро ба замина медиҳад
функсияи drop-shadow,
ки сояро ба замина медиҳад
функсияи invert,
ки рангҳои заминаро баръакс мекунад
функсияи opacity,
ки шиффофиро ба замина медиҳад
функсияи sepia,
ки заминаро ба сепия табдил медиҳад
хусусияти background,
ки ҳамчун хусусияти ихтисорӣ барои замина мебошад
хусусияти background-image,
ки бо ёрии он ба блок метавон тасвири заминаро дод
хусусияти filter,
ки услубро барои замина медиҳад