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प्रॉपर्टी,
जो बैकग्राउंड के लिए स्टाइल निर्धारित करती है
