brightness फ़ंक्शन
brightness फ़ंक्शन
बैकग्राउंड इमेज की चमक बदलने की अनुमति देता है। मूल चमक
100% या 1 मान से निर्धारित होती है,
इन्हें कम करने पर इमेज की चमक भी कम हो जाती है।
तदनुसार 100% से अधिक मान बढ़ाने पर
चमक बढ़ जाती है। नकारात्मक मान लागू नहीं होते हैं,
और खाली मान स्वचालित रूप से
1 के रूप में माना जाता है।
सिंटैक्स
सिलेक्टर {
filter: brightness(संख्या);
}
उदाहरण
चलिए हम अपनी इमेज के लिए चमक
20% पर सेट करते हैं:
<div id="elem"></div>
#elem {
filter: brightness(20%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
उदाहरण
और अब चलिए इमेज की चमक बढ़ाकर
120% कर देते हैं:
<div id="elem"></div>
#elem {
filter: brightness(120%);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
उदाहरण
चलिए हम अपनी इमेज के लिए मूल चमक सेट करते हैं:
<div id="elem"></div>
#elem {
filter: brightness(1);
background: url("bg.png") center / cover no-repeat;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
यह भी देखें
-
blurफ़ंक्शन,
जो बैकग्राउंड को ब्लर करता है -
contrastफ़ंक्शन,
जो बैकग्राउंड को कंट्रास्ट देता है -
drop-shadowफ़ंक्शन,
जो बैकग्राउंड को शैडो देता है -
hue-rotateफ़ंक्शन,
जो बैकग्राउंड को ह्यू रोटेशन देता है -
invertफ़ंक्शन,
जो बैकग्राउंड के रंगों को इनवर्ट करता है -
opacityफ़ंक्शन,
जो बैकग्राउंड को ओपेसिटी देता है -
sepiaफ़ंक्शन,
जो बैकग्राउंड को सेपिया में बदलता है -
backgroundप्रॉपर्टी,
जो बैकग्राउंड के लिए शॉर्टहैंड प्रॉपर्टी है -
background-imageप्रॉपर्टी,
जिसके द्वारा ब्लॉक को बैकग्राउंड इमेज दी जा सकती है -
filterप्रॉपर्टी,
जो बैकग्राउंड के लिए स्टाइल निर्धारित करती है