@fontface का उपयोग फोंट लोड इटैलिक

मैं बहुत तरह सीएसएस है:@fontface का उपयोग फोंट लोड इटैलिक

@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBold.ttf'); 
    font-weight:normal; 
    font-style: normal; 
} 
@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBoldItalic.ttf'); 
    font-weight:normal; 
    font-style: italic, oblique; 
} 
@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBlack.ttf'); 
    font-weight:bold; 
    font-style: normal; 
} 
@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBlackItalic.ttf'); 
    font-weight:bold; 
    font-style: italic, oblique; 
}

और इस तरह मेरी कक्षा के लिए एक नियम:

.font-alegreya { 
    font-family:alegreya; 
}

और अंत में HTML:

<li class="font-alegreya" data-styles="bold, italic, extrabold"> 
    Alegreya - Some sample words. 
</li>

अब , मैंने here on metaltoad और SO पर अन्य स्थानों को पढ़ा है कि कस्टम फोंट का उपयोग करने के लिए एक एकल फ़ॉन्ट-परिवार का पसंदीदा तरीका है और वह y कहां आखिरी बोल्ड-इटैलिक डालना है।

समस्या यह है कि फ़ॉन्ट प्रदर्शित होता है इटालिक। सीएसएस वर्ग में font-weight:normal का उपयोग करके, मुझे सामान्य प्रदर्शन वजन मिलता है, लेकिन font-style:normal इटालिक्स को साफ़ नहीं करता है। यह समझ में आता है, क्योंकि "संसाधन" टैब में "डेवलपर टूल्स" (-webkit) के तहत, मुझे केवल black-italic फ़ॉन्ट लोड किया गया है (मेरी सीएसएस फ़ाइल में दूसरा)। फ़ॉन्ट मेरे कंप्यूटर पर स्थापित है, लेकिन मैंने सर्वर पर फ़ाइल का नाम बदल दिया।

मैंने इसे ओपेरा (वेबकिट) और आईई 11 में देखा है, तो यह मेरा कोड है।

संपादित करें: टिप्पणियों में उल्लिखित अनुसार, मेरे पास बोल्ड और ब्लैक उलटा था। वह बोल्ड के लिए खाते हैं। लेकिन इटालिक अभी भी एक मुद्दा है।

स्रोत

2015-02-17 Josiah

, [इस समान प्रश्न] (http: // stackoverflow.com/questions/10609002/defining-css-font-face-bold-italic) को भी एक उत्तर की आवश्यकता है। – Josiah

पोस्ट में जोजोया संदर्भित एक टिप्पणी है जो आपकी मदद कर सकती है: http://stackoverflow.com/questions/10609002/defining-css-font-face-bold-italic#comment13766538_10615516 –

धन्यवाद @ ala_747 - लेकिन यह नहीं है जो मेरे पास है? सामान्य -> इटालिक -> बोल्ड -> बोल्ड-इटालिक? यही कारण है कि मैंने उन्हें उस क्रम में किया था। – Josiah

David Stone's answer आधिकारिक जवाब पर के रूप में @fontface को सवाल में कहा गया है, this spec का कहना है कि oblique, italic मान्य है।

जैसा कि उन्होंने कहा, एफएफ 3.6 को दो मान पसंद नहीं हैं। comments में बरी हुई दो-मूल्यों की अधिक रिपोर्टें काम नहीं कर रही हैं।

webkit bug reports में खुदाई करने पर, मुझे पता चला कि font-style के लिए मान को सीएस 2 से CSS3 में बदल दिया गया है। later css3 spec के अनुसार, अल्पविराम से अलग सूची की बजाय font-style संपत्ति के लिए केवल एक मान की अनुमति है।

तो आजकल, यदि आप अल्पविराम से अलग सूची में पास करते हैं, तो प्रतिपादन इंजन कहता है "यह वैध फ़ॉन्ट-शैली नहीं है। उनका मतलब normal होना चाहिए।" और आपकी पिछली सामान्य घोषणा को ओवरराइड करता है।

tl; डॉ: फ़ॉन्ट चेहरा सब इटैलिक फोंट प्रतिपादन है:

font-style: italic, oblique;

होना चाहिए

font-style: italic;

बस परस्पर-संदर्भ के लिए

स्रोत

2015-02-17 21:05:22 Josiah

@fontface का उपयोग फोंट लोड इटैलिक

उत्तर

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