सीएसएस फ़ॉन्ट-शैली

font-style . के साथ CSS संपत्ति हम अपने टेक्स्ट पर जोर देने के लिए विशेषताओं के एक सेट के साथ अपने फ़ॉन्ट को स्टाइल कर सकते हैं।

हमेशा की तरह, मेरा कोडपेन चेकआउट करें ताकि आप मेरे साथ कोड-अलॉन्ग कर सकें।

फ़ॉन्ट-शैली सिंटैक्स और विकल्प

font-style . का उपयोग करते समय हमारे पास निम्नलिखित विकल्प होते हैं . ध्यान दें, वे सभी कीवर्ड के रूप में निर्दिष्ट हैं।

font-style: normal;
font-style: italic;
font-style: oblique 30deg;
font-style: oblique;

फ़ॉन्ट-शैली कुछ सामान्य वैश्विक शैली खोजशब्दों का भी समर्थन करती है।

/* inherit from parent element */
font-style: inherit;
/* browser's default */
font-style: initial;
/* inherit if parent value, else initial */
font-style: unset;

सामान्य आपके निर्दिष्ट font-family . के भीतर सामान्य फ़ॉन्ट से संबंधित है ।

तिरछा के साथ हम वैकल्पिक रूप से कोण (-90 से 90) निर्दिष्ट कर सकते हैं और यदि कोई कोण निर्दिष्ट नहीं है तो यह 14 के लिए डिफ़ॉल्ट होगा।

ध्यान दें कि तिरछा और इटैलिक विनिमेय हो सकता है . यह ब्राउज़र समर्थन . के कारण है और यदि आप एक विशेष फ़ॉन्ट का उपयोग कर रहे हैं और यदि ब्राउज़र नहीं ढूंढता या समर्थन नहीं करता है तो तिरछा इटैलिक और इसी तरह का उपयोग करेगा।

oblique . का उपयोग करने से पहले , जांचें कि आपके ब्राउज़र पर तिरछा कीवर्ड पूरी तरह से समर्थित है या नहीं।

81% प्रतिभागियों ने कहा कि बूटकैंप में भाग लेने के बाद उन्हें अपनी तकनीकी नौकरी की संभावनाओं के बारे में अधिक आत्मविश्वास महसूस हुआ। आज ही एक बूटकैंप से मिलान करें।

बूटकैंप शुरू करने से लेकर अपनी पहली नौकरी खोजने तक, औसत बूटकैंप ग्रेड ने करियर संक्रमण में छह महीने से भी कम समय बिताया।

इसे ध्यान में रखते हुए, आइए आगे बढ़ते हैं और अपने h1 शीर्षक पर जोर देते हैं:

h1.title {
  font-family: 'Tangerine';
  font-style: normal;
}

आप देखेंगे कि कैसे हमने Google फोंट से टेंजेरीन फ़ॉन्ट आयात किया, यह फ़ॉन्ट सामान्य शैली कर्सिव है इसलिए इसे इस तरह प्रदर्शित किया जाता है।

इस विशेष फ़ॉन्ट के लिए, इसे कर्सिव बनाने से यह और तिरछा हो जाएगा, इसलिए हम शायद आवेदन नहीं करना चाहेंगे।

मुख्य उपयोग फ़ॉन्ट-शैली

ज्यादातर मामलों में सामान्य कीवर्ड का उपयोग करना बेमानी है। तो font-style . का मुख्य उपयोग संपत्ति जोर जोड़ने के लिए फ़ॉन्ट को इटैलिक बनाना है।

एक पैराग्राफ पर जोर देने के लिए, आइए उनमें से एक को इटैलिक करें।

p.par {
  font-family: 'Indie Flower';
  font-style: italic;
}

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

निष्कर्ष

font-style का उपयोग करना संपत्ति font-family . से गहराई से जुड़ी हुई है . साथ ही, जब तक oblique . का बेहतर ब्राउज़र समर्थन न हो कीवर्ड, इस संपत्ति का मुख्य उपयोग फोंट को इटैलिक बनाकर उन पर जोर देना होगा।