Filter касиети

filter касиети фонондогу сүрөткө белгилүү бир көркөм стиль же фильтр берет. Касиет көркөм стилдердин аталыштарын кабыл ала алат, алар filter функциясы менен түзүлөт же none (тандалган фильтрди жокко чыгаруу).

Синтаксис

селектор {
	filter: көркөм стиль же none;
}

Мисал

Келгиле, биздин сүрөтүбүз үчүн кара-ак фильтрди коёлу, ал эми үстүнө чыкканда аны жокко чыгаралы:

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

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

Ошондой эле караңыз

background касиети,
фон үчүн кыскартылган касиет
blur функциясы,
фонду булактайт
brightness функциясы,
фондун жарыктыгын белгилейт
contrast функциясы,
фондун контрасттуулугун белгилейт
drop-shadow функциясы,
фонго көлөкө берет
hue-rotate функциясы,
фондун түсүн белгилейт
invert функциясы,
фондун түстөрүн инверттейт
opacity функциясы,
фондун өтө ачыктыгын белгилейт
sepia функциясы,
фонду сепияга айландырат