invert функциясы
invert функциясы
фон суретінің түстерін инверттеуге мүмкіндік береді.
0 мәні
суреттің түпнұсқа күйінде қалатынын білдіреді.
100% немесе 1 мәні фон түстерін толығымен инверттейді.
Осы диапазонда орналасқан кез келген сан
түстерді ішінара инверттейді.
Теріс мән беруге болмайды.
Әдепкі бойынша мәні 0 тең.
Синтаксис
селектор {
filter: invert(сан);
}
Мысал
Келіңіздер, біздің суретіміздің түстерін
50% мәніне дейін инверттейік:
<div id="elem"></div>
#elem {
filter: invert(50%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Мысал
Енді келіңіздер, біздің суретіміздің түстерін
100% мәніне дейін инверттейік:
<div id="elem"></div>
#elem {
filter: invert(100%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Мысал
Енді келіңіздер,
invert функциясына
0 тең мән берейік:
<div id="elem"></div>
#elem {
filter: invert(0);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Сондай-ақ қараңыз
-
blurфункциясы,
бұл фонды бұлыңғырлатады -
brightnessфункциясы,
бұл фонға жарқырауын береді -
contrastфункциясы,
бұл фонға контрасттылық береді -
drop-shadowфункциясы,
бұл фонға көлеңке береді -
hue-rotateфункциясы,
бұл фонға түстік береді -
opacityфункциясы,
бұл фонға мөлдірлік береді -
sepiaфункциясы,
бұл фонды сепияға айналдырады -
backgroundсипаты,
бұл фон үшін қысқартылған сипат -
background-imageсипаты,
бұл блокқа фондық сурет беру үшін қолданылады -
filterсипаты,
бұл фон үшін стиль береді