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