Sepia funktsiyasi

sepia funktsiyasi fon rasmidan sepia yaratishga imkon beradi - jigarrang tusdagi oq-qora rasm. 0 qiymati rasm o'zgarishsiz qolishini bildiradi. 100% yoki 1 qiymati fonni butunlay sepiaga aylantiradi. Ushbu oraliqda joylashgan har qanday son sepia qo'llanishini chiziqli tarzda belgilaydi. Salbiy qiymat berib bo'lmaydi. Standart qiymat 0 ga teng.

Sintaksis

selector {
	filter: sepia(son);
}

Misol

Keling, rasmimizni to'liq sepiaga aylantiramiz:

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

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

Misol

Endi esa sepia qo'llanish darajasini 50% ga kamaytiramiz:

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

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

Misol

Endi esa sepia funktsiyasiga 0 ga teng qiymat beramiz:

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

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

Shuningdek qarang

fonni xiralashtiradigan blur funktsiyasi,
fonga yorqinlik beradigan brightness funktsiyasi,
fonga kontrastlik beradigan contrast funktsiyasi,
fonga soya beradigan drop-shadow funktsiyasi,
fonga rangbaranglik beradigan hue-rotate funktsiyasi,
fon ranglarini inversiyalaydigan invert funktsiyasi,
fonga shaffoflik beradigan opacity funktsiyasi,
fon uchun qisqartma xususiyat bo'lgan background xususiyati,
blokka fon rasm berish uchun ishlatiladigan background-image xususiyati,
fon uchun uslub belgilaydigan filter xususiyati,