36: ग्रंटिकॉन का उपयोग करना - सीएसएस-ट्रिक्स

Anonim

हमने इनलाइन और तत्व का उपयोग करने के बारे में बात करने में बहुत समय बिताया है । आप इसके साथ एक आइकन सिस्टम बना सकते हैं जो फायदे के साथ व्याप्त है।

आप अन्य तरीकों से एक SVG आइकन सिस्टम बना सकते हैं। आप एसवीजी में एक पारंपरिक ग्रिड स्प्राइट शीट बिछा सकते हैं और पृष्ठभूमि-स्थिति स्प्राइट कर सकते हैं जैसे हम रेखापुंज छवियों के साथ करते थे। भविष्य में आप टुकड़ा पहचानकर्ताओं का उपयोग करने में सक्षम होंगे, ताकि थोड़ा आसान भी हो जाए। इन बातों पर अधिक जानकारी

एक और तरीका है एसवीजी छवि के यूआरआई का सीएसएस फ़ाइल में अधिकार एम्बेड करना। यही वह दृष्टिकोण है जो ग्रंटिकॉन लेता है।

ग्रंटिकॉन एसवीजी आइकन सिस्टम को स्वचालित करने के लिए एक ग्रंट प्लगइन है। यह एसवीजी से भरा एक फ़ोल्डर लेता है और उन्हें एक सीएसएस फ़ाइल में संसाधित करता है। एसवीजी छवियों के फ़ाइल नामों के आधार पर चयनकर्ताओं का एक समूह होता है, background-imageजिसमें एसवीजी डेटा यूआरआई (आधार 64 नहीं) होता है।

इस तरह से करने का मतलब है कि आपको एसवीजी और फ़ाइल आकार के लाभों की मापनीयता मिल जाएगी, लेकिन यह इसके बारे में है। फिर भी, अक्सर आप सभी की जरूरत है।

ग्रंटिकॉन के बारे में शायद सबसे अच्छा हिस्सा है, लेकिन यह है कि यह आपको कमियां के लिए आवश्यक सब कुछ देता है। इसमें यूआरआई पीएनजी और यहां तक ​​कि स्वयं पीएनजी के डेटा के लिए एक वैकल्पिक स्टाइलशीट भी शामिल है (जो कि यह आपके लिए बनाता है)। इसके अलावा, एक स्क्रिप्ट जो आप समर्थन निर्धारित करने के लिए अपने पृष्ठ पर उपयोग करते हैं और केवल उपयुक्त स्टाइलशीट लोड करते हैं।

मुझे लगता है कि यह कहना उचित है कि यह कमियों को अभी के लिए दोष / तकनीक से संभालना आसान बनाता है । ऐसा नहीं है कि यह असंभव है।

ग्रम्पिकॉन ग्रंटिकॉन का इन-ब्राउज़र संस्करण है, जिसका उपयोग हमने इस स्क्रैंकास्ट में किया था।

ग्रंटिकॉन है, जैसा कि मैंने इसे लिखा है, एम्बेडेड इनलाइन एसवीजी को उत्तरोत्तर बढ़ाने के लिए एक तरह से काम कर रहा है, जो बहुत अच्छा होगा!