झूम - सीएसएस-ट्रिक्स

Anonim

zoomसीएसएस में संपत्ति आप अपनी सामग्री पैमाने पर करने की अनुमति देता है। यह गैर-मानक है, और मूल रूप से केवल इंटरनेट एक्सप्लोरर में लागू किया गया था। हालाँकि कई अन्य ब्राउज़र अब ज़ूम का समर्थन करते हैं, यह उत्पादन साइटों के लिए अनुशंसित नहीं है।

.zoom ( zoom: 150%; )

"समर्थित: मान हैं:

  • percentage - इस प्रतिशत से स्केल
  • number- प्रतिशत और पैमाने में कनवर्ट करें - 1 == 100%; 1.5 == 150%;
  • normal - ज़ूम: 1;

यदि आपका ब्राउज़र इसका समर्थन करता है, तो आप इन चित्रों को विभिन्न आकारों के रूप में देखेंगे:

इस पेन को देखें!

ज़ूम एक पुरानी IE चीज़ है। यह ऐसा कुछ नहीं है जिसका आपको लाइव साइटों पर उपयोग करना चाहिए। यदि आप सामग्री को स्केल करना चाहते हैं, तो CSS ट्रांसफ़ॉर्म का उपयोग करें। अगर आपको ओल्डई सपोर्ट की जरूरत है तो आप फिल्टर्स का भी इस्तेमाल कर सकते हैं

IE6 के दिनों में, ज़ूम का उपयोग मुख्य रूप से हैक के रूप में किया जाता था। IE6 और IE7 दोनों में रेंडरिंग बग के कई ज़ूम का उपयोग करके तय किया जा सकता है। उदाहरण के लिए, display: inline-blockIE6 / 7 में बहुत अच्छा काम नहीं किया। zoom: 1समस्या को निर्धारित करना । आईई ने अपने लेआउट का प्रतिपादन कैसे किया, इसके साथ बग को करना था। सेटिंग zoom: 1को हैलआउट नाम की आंतरिक संपत्ति पर चालू किया गया, जिसने समस्या को ठीक कर दिया।

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

क्रोम सफारी फ़ायर्फ़ॉक्स ओपेरा अर्थात एंड्रॉयड आईओएस
कोई 4.0+ है कोई नहीं कोई नहीं 5.5+ है टी.बी.डी. टी.बी.डी.

zoomसंस्करण 4 के बाद से सफारी भी समर्थन करता है। हालांकि, इसने एक नया मूल्य जोड़ा reset:। यह ब्राउज़र को बताता है कि ज़ूम पर अपने तत्व को ज़ूम न करें। तो आपका cmd / ctrl +? यह zoom: resetलागू तत्वों के साथ काम नहीं करता है।