Функция 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,
фон учун услуб беради