CSS इमेज-रेंडरिंग प्रभाव

व्याख्या और उपयोग

image-rendering गुण छवि विस्तार के एल्गोरिदम के प्रकार को निर्दिष्ट करता है।

ध्यान दें:यह गुण नष्ट छवि के लिए अप्रयुक्त है।

उदाहरण

छवि विस्तार के विभिन्न एल्गोरिदमों को दिखाता है:

.image {
  height: 100px;
  width: 100px;
  image-rendering: auto;
}
.crisp-edges {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}
.pixelated {
  image-rendering: pixelated;
}
.smooth {
  image-rendering: smooth;
}
.high-quality {
  image-rendering: high-quality;
}

अपने आप सिर्फ आया

CSS व्याकरण

image-rendering: auto|smooth|high-quality|crisp-edges|pixelated|initial|inherit;

गुण मान

तकनीकी विवरण

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

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

Chrome, Edge और Opera -webkit-optimize-contrast को crisp-edges के रूप में एलियस इस्तेमाल करते हैं।