ionic-framework
Ionicons
खोज…
टिप्पणियों
आधुनिक वेब विकास में आइकन प्रदर्शित करने के लिए फोंट का उपयोग करना आम बात है। चूंकि फोंट वैक्टर हैं, वे स्वतंत्र रूप से रिज़ॉल्यूशन हैं और सीएसएस के माध्यम से आसानी से रंगे जा सकते हैं, बस बिटमैप छवियों आदि की तुलना में कुछ फायदे का नामकरण करने के लिए Ionicons को उसी टीम द्वारा बनाया गया था जिसे Ionic फ्रेमवर्क द्वारा बनाया गया था और किसी भी परियोजना में उपयोग किया जा सकता है। वे 100% मुक्त और खुले स्रोत हैं। एमआईटी लाइसेंस प्राप्त है।
Ionicons का उपयोग अपने दम पर या Ionics CSS घटकों के साथ किया जा सकता है जब उनके पास मूल तत्वों के अनुसार कुछ निश्चित शैली होती है।
आइकन का मुखपृष्ठ और सूची यहां देखी जा सकती है: http://ionicons.com/
मूल उपयोग
फ़ॉन्ट आइकन आमतौर पर <i> टैग के अंदर रखे जाते हैं। इओनिक में आसान उपयोग के लिए आइकन के लिए डिफ़ॉल्ट सीएसएस शैलियों है। उपयोग का सबसे बुनियादी उदाहरण:
<i class="icon ion-home"></i>
विस्तारित उपयोग
Ionic में कुछ CSS घटक हैं जहाँ आप Ionicons का उपयोग डिफ़ॉल्ट रूप से कर सकते हैं जिसमें प्रीसेट स्टाइल है। आइटम में range वर्ग <div> इनपुट और उसके अंदर के आइकन दोनों पर सही स्टाइल लागू करेगा। यहाँ एक श्रेणी स्लाइडर का एक उदाहरण है।
<div class="item range">
<i class="icon ion-volume-low"></i>
<input type="range" name="volume">
<i class="icon ion-volume-high"></i>
</div>
आयनिक टैब में आयनिक उपयोग का एक और उदाहरण जो मेनू की तरह एक टैब बनाएगा। tabs-striped tabs-color-assertive कक्षाएं टैब की शैली को स्वयं परिभाषित करती हैं। प्रतीक का उपयोग सरल <i> टैग के साथ किया जाता है और वे अभिभावकों के लिए लागू कक्षाओं से उनकी स्थितिपूर्ण स्टाइल प्राप्त करते हैं।
<div class="tabs-striped tabs-color-assertive">
<div class="tabs">
<a class="tab-item" href="#">
<i class="icon ion-home"></i>
Home
</a>
<a class="tab-item" href="#">
<i class="icon ion-gear-b"></i>
Settings
</a>
</div>