hue-rotate funksiyasi

hue-rotate funksiyasi fon tasvirining rangdorligini rang doirasidagi rang o'zgarishi orqali o'zgartirish imkonini beradi. Xususiyat qiymatlari darajalarda ko'rsatiladi, rang doirasining burchagini bildiradi. 0 yoki 360 qiymati tasvir o'zgarishsiz qolishini bildiradi, va bu oraligdagi har qanday raqam fon rang o'zgarishining o'zgarishiga olib keladi. Standart qiymati 0deg.

Sintaksis

selector {
	filter: hue-rotate(burchak);
}

Misol

Keling, tasvirimiz uchun rangdorlikni 150deg ga teng qilib belgilaymiz:

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

Misol

Endi tasvir rangdorligini 50deg ga teng qilib belgilaymiz:

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

Misol

Keling, hue-rotate xususiyatida qiymat bermaymiz:

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

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

Shuningdek qarang

blur funksiyasi,
fonni xira qiladi
brightness funksiyasi,
fonga yorqinlik beradi
contrast funksiyasi,
fonga kontrastlik beradi
drop-shadow funksiyasi,
fonga soya beradi
invert funksiyasi,
fon ranglarini inversiyalaydi
opacity funksiyasi,
fonga shaffoflik beradi
sepia funksiyasi,
fonni sepia rangiga aylantiradi
background xususiyati,
fon uchun qisqartirilgan xususiyat hisoblanadi
background-image xususiyati,
uning yordamida blokka fon tasviri berish mumkin
filter xususiyati,
fon uchun uslub belgilaydi