CSS blur() फ़ंक्शन

वर्णन और उपयोग

CSS का blur() फ़िल्टर फ़ंक्शन एलीमेंट पर झुर्री प्रभाव लगाता है।मात्रा बढ़ने के साथ, झुर्री प्रभाव बढ़ता है。

यदि मात्रा नहीं निर्दिष्ट की गई है, तो डिफ़ॉल्ट 0 इस्तेमाल किया जाता है。

उदाहरण

उदाहरण 1

<h1> और <img> एलीमेंटों पर अलग-अलग झुर्री प्रभाव लगाएं:

h1 {
  filter: blur(2px);
}
#img1 {
  filter: blur(2px);
}
#img2 {
  filter: blur(6px);
}

खुद को प्रयोग करें

उदाहरण 2

झुर्री बैकग्राउण्ड बनाएं:

img.background {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: -1;
  filter: blur(35px);
}

खुद को प्रयोग करें

CSS व्याकरण

blur(radius)
मात्रा वर्णन
radius

वैकल्पिक।झुर्री की दूरी निर्दिष्ट करें।मात्रा बढ़ने के साथ, झुर्री प्रभाव बढ़ता है。

यदि ग्राॅण्ड नहीं दिया गया है, तो डिफ़ॉल्ट 0 (कोई प्रभाव नहीं) इस्तेमाल किया जाता है。

तकनीकी विवरण

संस्करण: CSS Filter Effects Module Level 1

ब्राउज़र समर्थन

तालिका में दिए गए नंबर इस फ़ंक्शन को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र का संस्करण को प्रदर्शित करते हैं。

च्रोम एज फ़ायरफॉक्स सफारी ओपेरा
18 12 35 6 15

संबंधित पृष्ठ

संदर्भ:CSS filter गुण

संदर्भ:CSS ब्रीटनेस() फ़ंक्शन

संदर्भ:CSS contrast() फ़ंक्शन

संदर्भ:CSS drop-shadow() फ़ंक्शन

संदर्भ:CSS grayscale() फ़ंक्शन

संदर्भ:CSS hue-rotate() फ़ंक्शन

संदर्भ:CSS invert() फ़ंक्शन

संदर्भ:CSS opacity() फ़ंक्शन

संदर्भ:CSS सेटरेट() फ़ंक्शन

संदर्भ:CSS सेपिया() फ़ंक्शन