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