Hue-rotate funksiýasy

hue-rotate funksiýasy fon suratynyň reňkliligini reňk tegelegindeki reňk öwrülişi arkaly üýtgetmäge mümkinçilik berýär. Aýratynlygyň bahalary graduslarda görkezilýär, ol reňk tegeleginiň burçuny görkezýär. 0 ýa-da 360 bahasy suratyň üýtgemeýändigini görkezýär, bu aralygyň içindäki islendik san fonuň reňk öwrülişiniň üýtgemegine getirýär. Bellenen hali boýunça baha 0deg deňdir.

Sintaksis

selektor {
	filter: hue-rotate(burç);
}

Mysal

Geliň suratymyz üçin reňkliligi 150deg deň edeliň:

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

Mysal

Indi suratyň reňkliligini 50deg deň edeliň:

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

Mysal

Geliň aýratynlykda hue-rotate bahasyny görkezmezden geçeliň:

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

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

Şeýle-de serediň

fon syrkawylandyrýan blur funksiýasy
fona ýagtylyk berýän brightness funksiýasy
fona kontrastlyk berýän contrast funksiýasy
fona kölege berýän drop-shadow funksiýasy
fonuň reňklerini inwersirleşdirýän invert funksiýasy
fona şaffaflyk berýän opacity funksiýasy
fonu sepia görnüşine öwürýän sepia funksiýasy
fon üçin gysgaldylan aýratynlyk bolan background aýratynlygy
bir bloka fon suratyny belleýän background-image aýratynlyk
fon üçin stili belleýän filter aýratynlyk