फ़ॉन्ट-फेस यूआरएल

पर कंसैट क्वेरी स्ट्रिंग ब्राउज़र के कैश से बचने के लिए, मैं अपने @font-face के यूआरएल में वर्जन क्वेरीस्ट्रिंग को जोड़ना चाहता हूं। बहुत सारे यूआरएल हैं। इसे सही तरीके से कैसे करें? बहुत बढ़िया फ़ॉन्ट काफ़ॉन्ट-फेस यूआरएल

@font-face { 
    font-family: 'fontawesome'; 
    src: url('/styles/fonts/fontawesome/fontawesome.eot?6840zz'); 
    src: url('/styles/fonts/fontawesome/fontawesome.eot?6840zz#iefix') format('embedded-opentype'), 
     url('/styles/fonts/fontawesome/fontawesome.ttf?6840zz') format('truetype'), 
     url('/styles/fonts/fontawesome/fontawesome.woff?6840zz') format('woff'), 
     url('/styles/fonts/fontawesome/fontawesome.svg?6840zz#icomoon') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
}

स्रोत

2017-01-19 Engineer

2 चीजें जो मैं पूछना चाहता हूं: आप fontawesome.eot चाहते हैं? 6840zz यह fontawesome.eot? V = 1.1.0 कुछ संस्करण की तरह होना चाहिए। दूसरी बात आपके पास कितनी फाइलें हैं और आप किस आईडीई का उपयोग कर रहे हैं? –

@NaveedRamzan क्वेरी स्ट्रिंग में '68400zz' क्या है? शायद इसके पीछे एक तर्क है। और इस सब से आईडीई कैसे संबंधित हो सकता है? – Engineer

मैं सोच रहा था कि क्या आप विकल्प ढूंढ और प्रतिस्थापित कर सकते हैं और इन सभी प्रकार के लिंक में संस्करण जोड़ सकते हैं। क्या ऐसा नहीं है? –

अधिकांश कार्यान्वयनों @font-face फ़ॉन्ट रास्तों को क्वेरी स्ट्रिंग संस्करणीकृत संलग्न कर देगा। जब फ़ॉन्ट को किसी नए संस्करण में अपडेट किया जाता है तो ये संस्करण क्वेरी स्ट्रिंग कैश को बस्ट कर देंगे। यही है, जब आप फ़ॉन्ट को अद्यतन करते हैं तो संस्करण क्वेरी क्वेरी स्ट्रिंग ?v=4.7.0 से ?v=4.7.1 जैसी किसी चीज़ से बदलेगी।

ज्यादातर मामलों में आपको कुछ भी करने की आवश्यकता नहीं होगी क्योंकि अधिकांश कार्यान्वयन आपके लिए इसे संभालेगा। ध्यान रखें, कई अन्य @font-face जनरेटर और पैकेज भी एक संस्करण पैरामेट संलग्न करेंगे। यहाँ कुछ उदाहरण हैं:

आप शामिल font-awesome.css फ़ाइल संस्करणीकृत होगा क्वेरी पथ से जुड़ी तार http://fontawesome.io/ से फ़ॉन्ट बहुत बढ़िया किट डाउनलोड करते हैं फ़ॉन्ट बहुत बढ़िया किट

करें। पूर्व।
```
@font-face { 
    font-family: 'FontAwesome'; 
    src: url('../fonts/fontawesome-webfont.eot?v=4.7.0'); 
    src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 
```
?v=4.7.0 संस्करण क्वेरी स्ट्रिंग है। यदि आप सड़क के नीचे फ़ॉन्ट विस्मयकारी का एक नया संस्करण डाउनलोड करते हैं तो यह संस्करण संख्या बदलेगी।
फ़ॉन्ट बहुत बढ़िया CDN

आप CDN कार्यान्वयन का उपयोग करते हैं आप की तरह

यह एक <script> शामिल करने के लिए मिल जाएगा निम्नलिखित सीएसएस आयात करेगा:
```
@font-face { 
    font-family: 'FontAwesome'; 
    src: url('//use.fontawesome.com/releases/v4.7.0/fonts/fontawesome-webfont.eot'); 
    src: url('//use.fontawesome.com/releases/v4.7.0/fonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'), 
    url('//use.fontawesome.com/releases/v4.7.0/fonts/fontawesome-webfont.woff2') format('woff2'), 
    url('//use.fontawesome.com/releases/v4.7.0/fonts/fontawesome-webfont.woff') format('woff'), 
    url('//use.fontawesome.com/releases/v4.7.0/fonts/fontawesome-webfont.ttf') format('truetype'), 
    url('//use.fontawesome.com/releases/v4.7.0/fonts/fontawesome-webfont.svg#fontawesomeregular') format('svg'); 
    font-weight: normal; 
    font-style: normal; 
} 
```
फ़ॉन्ट विस्मयकारी सीडीएन के यूआरएल में वर्जन नंबर शामिल है, और अपडेट होने पर यह बदल जाएगा, कैश तोड़ने और एलिमिनेटी एक संस्करण क्वेरी पैरामीटर जोड़ने की जरूरत है।
सास या का उपयोग करते हुए कम

आप कम/सास फ़ाइलें उपयोग कर रहे हैं संस्करणीकृत क्वेरी स्ट्रिंग जोड़ दिया जाएगा। पूर्व।
```
@font-face { 
    font-family: 'FontAwesome'; 
    src: url('@{fa-font-path}/[email protected]{fa-version}'); 
    src: url('@{fa-font-path}/fontawesome-webfont.eot?#iefix&[email protected]{fa-version}') format('embedded-opentype'), 
    url('@{fa-font-path}/[email protected]{fa-version}') format('woff2'), 
    url('@{fa-font-path}/[email protected]{fa-version}') format('woff'), 
    url('@{fa-font-path}/[email protected]{fa-version}') format('truetype'), 
    url('@{fa-font-path}/[email protected]{fa-version}#fontawesomeregular') format('svg'); 
    // src: url('@{fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts 
    font-weight: normal; 
    font-style: normal; 
} 
```
@{fa-version} वर्तमान संस्करण (वर्तमान में फॉन्ट पथ के लिए 4.7.0 संलग्न कर देगा। यह संस्करण संख्या जब फ़ॉन्ट अद्यतन किया जाता है अद्यतन करेगा। इस अर्थ में आप सभी संस्करण क्वेरी पैरामीटर एक ही बार में fa-version बदलकर अद्यतन कर सकते हैं चर।

#iefix

#iefix हैश के बारे में, यह कोई मुद्दा फिक्सिंग की एक विधि है IE8 और नीचे एक एकल src के भीतर एकाधिक फ़ॉन्ट स्वरूपों को परिभाषित करते समय। यदि आपको IE8 में काम करने के लिए अपने फ़ॉन्ट की आवश्यकता है और नीचे आपको #iefix (या कोई हैश`) जोड़ने की आवश्यकता है, तो वे ब्राउज़र त्रुटियों को फेंक नहीं देते हैं। इस पर SO question में अधिक।

अन्य @ फॉन्ट-फेस फ़ॉन्ट्स और क्रियान्वयन

आप फ़ॉन्ट के अलावा किसी अन्य फ़ॉन्ट बहुत बढ़िया उपयोग कर रहे हैं, या किसी अन्य कार्यान्वयन, आप फ़ॉन्ट रास्ते पर एक हैश जोड़ सकते हैं अपनी खुद की कैश-बस्ट बनाने के लिए । 01302017 जैसे दिनांक स्ट्रिंग को देखना आम बात है, जिसे आवश्यकता होने पर मैन्युअल रूप से या बिल्ड स्क्रिप्ट के माध्यम से अपडेट किया जा सकता है।

स्रोत

2017-01-30 15:32:39

ग्रेट उत्तर, धन्यवाद! – Engineer

उस छद्म हरे रंग की जांच पाने की संभावना बढ़ाने के लिए मैं कुछ भी जोड़ सकता हूं? ;) –

निश्चित रूप से, मैं बस भूल गया है;) – Engineer

फ़ॉन्ट-फेस यूआरएल

उत्तर

संबंधित मुद्दे