सवाल बूटस्ट्रैप 3 ग्लाइफिकॉन सीडीएन


ध्यान दें!

बूटस्ट्रैप आइकन वापस आ गए हैं बाद यह पुल अनुरोध विलय


पिछले कुछ हफ्तों के लिए इस पर आगे और आगे जाने के बाद, मैंने फैसला किया है मुख्य रेपो में ग्लाइफिकॉन आइकन फ़ॉन्ट को पुनर्स्थापित करें। यह देखते हुए कि UI में प्रचलित आइकन कितने हैं, यह शायद अधिकांश लोगों को सीएसएस और जेएस के समान स्थान पर (या कुछ अन्य आइकन फ़ॉन्ट) शामिल करने के लिए असंतुष्ट नहीं है।

इस अद्यतन के साथ निम्नलिखित आता है:

  • दस्तावेज़ों को पुनर्स्थापित करता है (घटक पृष्ठ पर)
  • नए चर, @icon-font-path तथा @icon-font-nameआइकन फोंट जोड़ने और हटाने में लचीलापन के लिए
  • नवीनतम ग्लाइफिकॉन में अपग्रेड (40 नए आइकन जोड़ना)
  • हटा देता है पुराने ग्लाइफिकॉन सीएसएस पेज से उल्लेख करते हैं

हम भविष्य में आइकन फोंट के अनुकूलन में सुधार करने के लिए काम करेंगे ताकि फ़ॉन्ट लाइब्रेरी को स्वैप करना आसान हो (जो मूल हटाने के लिए पूरी प्रेरणा थी)।


ट्विटर बूटस्ट्रैप ग्लाइफिकॉन के नए संस्करण का सीडीएन यूआरएल कौन सा है?

बूटस्ट्रैप 3 से वे एक अलग भंडार में चले गए थे, लेकिन मुझे कोई सीडीएन नहीं मिला।

आधिकारिक दस्तावेज से:

बूटस्ट्रैप 3 के लॉन्च के साथ, आइकन को एक अलग भंडार में ले जाया गया है। यह प्राथमिक प्रोजेक्ट को जितना संभव हो सके दुबला रखता है, लोगों को आइकन लाइब्रेरीज़ को स्वैप करना आसान बनाता है, और ग्लाइफिकॉन आइकन फोंट बूटस्ट्रैप के बाहर अधिक लोगों के लिए अधिक आसानी से उपलब्ध कराता है।

पर सरकारी वेबसाइट वे आइकन के लिए एक सीडीएन यूआरएल प्रदान नहीं करते हैं।

इसे कहां मिल सकता है? मैं भंडार डाउनलोड नहीं करना चाहता हूं और इसे अपने प्रोजेक्ट में शामिल करना चाहता हूं।


76
2017-08-14 03:45


मूल


बूस्ट्रैप सीडीएन की बूटस्वाच थीम सीएसएस फाइलों में ग्लाइफिकॉन शामिल नहीं हैं, क्या मैं सही हूँ? फ़ाइल: netdna.bootstrapcdn.com/bootswatch/3.0.0/amelia/... - trante


जवाब:


हाल के साथ बूटस्ट्रैप 3 की रिहाई, और ग्लाइफिकॉन को मुख्य बूटस्ट्रैप रेपो में वापस विलय किया जा रहा है, बूटस्ट्रैप सीडीएन अब सेवा कर रहा है ग्लिफिकॉन सहित पूर्ण बूटस्ट्रैप 3.0 सीएसएस। बूटस्ट्रैप सीएसएस संदर्भ में आपको शामिल करने की आवश्यकता है: ग्लाइफ़िकॉन और इसकी निर्भरता सीडीएन साइट पर सापेक्ष पथ पर हैं और इन्हें संदर्भित किया गया है bootstrap.min.css

एचटीएमएल में:

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">

सीएसएस में:

 @import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css");

यहाँ एक काम है डेमो

ध्यान दें कि आप का उपयोग करना है .glyphicon के बजाय कक्षाएं .icon:

उदाहरण:

<span class="glyphicon glyphicon-heart"></span>

यह भी ध्यान दें कि आपको अभी भी शामिल करने की आवश्यकता होगी bootstrap.min.js बूटस्ट्रैप जावास्क्रिप्ट घटकों के उपयोग के लिए, देखें बूटस्ट्रैप सीडीएन यूआरएल के लिए


यदि आप अलग से ग्लाइफिकॉन का उपयोग करना चाहते हैं, आप सीधे ग्लाइफिकॉन सीएसएस को संदर्भित करके ऐसा कर सकते हैं बूटस्ट्रैप सीडीएन

एचटीएमएल में:

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">

सीएसएस में:

@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css");

के बाद से css फ़ाइल में पहले से ही सभी आवश्यक ग्लाइफिकॉन निर्भरताएं शामिल हैं (जो बूटस्ट्रैप सीडीएन साइट पर एक सापेक्ष पथ में हैं), जोड़ना css ग्लिफिकॉन का उपयोग शुरू करने के लिए फ़ाइल करना है।

यहाँ एक काम है डेमो बूटस्ट्रैप के बिना ग्लाइफिकॉन का।


131
2017-08-14 07:17



हां दिलचस्प। सही जवाब लगता है, लेकिन इस यूआरएल पर स्विच करते समय आइकन दिखाई नहीं देते हैं। फ़ॉन्ट भयानक काम करता है। आइकन नियमों के साथ सीएसएस फ़ाइल लोड हो गई है। क्या मुझे और कुछ चाहिए? इमेजिस? - Ionică Bizău
मेरे लिये कार्य करता है। डेमो - edsioufi
@ जॉन ツ सीएसएस फ़ाइल में पहली कक्षा एक @ फ़ॉन्ट-फेस क्लास है जो सभी आवश्यक फ़ॉन्ट फ़ाइलों को आयात करती है (एक सहित svg छवि फ़ाइल), जो कि एक सापेक्ष पथ में हैं बूटस्ट्रैप सीडीएन साइट। तो आपको और कुछ चाहिए नहीं। - edsioufi
डेमो के लिए धन्यवाद। मैं बाद में एक नज़र डालेगा और जल्द ही मेरा आवेदन कार्य इस जवाब गधे को स्वीकार करूंगा। कृपया अपना उत्तर संपादित करें और सामग्री से सामग्री को आईडी में जोड़ें। धन्यवाद! - Ionică Bizău
बहुत बहुत धन्यवाद। मैंने अभी देखा है .icon अब और उपयोग नहीं किया जाता है। - Ionică Bizău


एक विकल्प का उपयोग करना होगा फ़ॉन्ट-बहुत बढ़िया आइकन के लिए:

फ़ॉन्ट-विस्मयकारी सहित

खुला सीडीएनजेएस पर फ़ॉन्ट-विस्मयकारी और नवीनतम संस्करण के सीएसएस यूआरएल की प्रतिलिपि बनाएँ:

<link rel="stylesheet" href="<url>">

या सीएसएस में

@import url("<url>");

उदाहरण के लिए (नोट, संस्करण बदल जाएगा):

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">

उपयोग:

<i class="fa fa-bed"></i>

इसमें शामिल है बहुत सारे आइकन!


27
2017-08-14 03:54



आइकन काम करने की कोशिश करने के कुछ घंटों के बाद, फ़ॉन्ट-भयानक सीडीएन से लिंक करने से मेरी समस्या हल हो गई। धन्यवाद। - Eenvincible
@Eenvincible उपयोग करने के लिए मत भूलना नवीनतम संस्करण। मेरे उत्तर से लिंक थोड़ा पुराना है। - Ionică Bizău
अंततः मुझे सीडीएन का उपयोग करने के बाद काम करने के लिए मिला। - Eenvincible
यूआरएल बदल गया: <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"> - nimrod
और फ़ॉन्ट-भयानक फ़ाइल में बहुत अधिक आइकन हैं। अच्छा लगा। - dudewad


हालांकि बूटस्ट्रैप सीडीएन ने बूटस्ट्रैप.मिन.cएसएस में ग्लिफिकॉन को बहाल किया है, बूटस्ट्रैप सीडीएन की बूटस्वाच सीएसएस फाइलों में ग्लाइफिकॉन शामिल नहीं हैं।

उदाहरण के लिए अमेलिया विषय: http://bootswatch.com/amelia/ 

डिफ़ॉल्ट एमेलिया में इस फ़ाइल में ग्लाइफ़िकॉन हैं: http://bootswatch.com/amelia/bootstrap.min.css 

लेकिन बूटस्ट्रैप सीडीएन की सीएसएस फ़ाइल में ग्लाइफिकॉन शामिल नहीं हैं: http://netdna.bootstrapcdn.com/bootswatch/3.0.0/amelia/bootstrap.min.css

इसलिए @edsioufi ने उल्लेख किया है, यदि आप बूटस्ट्रैप सीडीएन से Bootswatch फ़ाइलों का उपयोग करते हैं, तो आपको ग्लिफ़िकॉन सीएसएस शामिल करना चाहिए। फ़ाइल: http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css


2
2017-09-17 18:40



बूटस्ट्रैप पर कस्टमाइज़र कभी-कभी अमान्य फ़ॉन्ट फ़ाइलों को उत्पन्न करता है। फ़ॉन्ट फ़ाइलों के एक अलग डाउनलोड ने मुझे अपने आइकन वापस पाने में मदद की। कभी-कभी बूटस्ट्रैप पैकेज बग। - Clain Dsilva
trante: आपकी जानकारी गलत है। यदि आप अपने लिंक की जांच करते हैं तो आप पाएंगे कि Bootswatch थीम के लिए बूटस्ट्रैप सीडीएन में ग्लाइफिकॉन शामिल हैं। - Michael Moriarty