ფუნქცია 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,
რომელიც ფონის სტილს განსაზღვრავს