सीएसएस फ़ॉन्ट्स
अपनी वेबसाइट के लिए सही फ़ॉन्ट चुनना महत्वपूर्ण है!
फ़ॉन्ट चयन महत्वपूर्ण है
पाठकों को वेबसाइट का अनुभव कैसे होता है, इस पर सही फ़ॉन्ट चुनने का बहुत बड़ा प्रभाव पड़ता है।
सही फॉन्ट आपके ब्रांड के लिए एक मजबूत पहचान बना सकता है।
पढ़ने में आसान फ़ॉन्ट का उपयोग करना महत्वपूर्ण है। फ़ॉन्ट आपके टेक्स्ट में मूल्य जोड़ता है। फ़ॉन्ट के लिए सही रंग और टेक्स्ट आकार चुनना भी महत्वपूर्ण है।
सामान्य फ़ॉन्ट परिवार
CSS में पाँच सामान्य फ़ॉन्ट परिवार हैं:
- सेरिफ़ फोंट में प्रत्येक अक्षर के किनारों पर एक छोटा स्ट्रोक होता है। वे औपचारिकता और लालित्य की भावना पैदा करते हैं।
- सैन्स-सेरिफ़ फोंट में साफ रेखाएं होती हैं (कोई छोटा स्ट्रोक संलग्न नहीं होता है)। वे एक आधुनिक और न्यूनतर रूप बनाते हैं।
- मोनोस्पेस फोंट - यहाँ सभी अक्षरों की निश्चित चौड़ाई समान है। वे एक यांत्रिक रूप बनाते हैं।
- कर्सिव फॉन्ट मानव लिखावट की नकल करते हैं।
- फंतासी फ़ॉन्ट सजावटी/चंचल फ़ॉन्ट हैं।
सभी अलग-अलग फ़ॉन्ट नाम सामान्य फ़ॉन्ट परिवारों में से एक के हैं।
सेरिफ़ और सेन्स-सेरिफ़ फ़ॉन्ट्स के बीच अंतर
नोट: कंप्यूटर स्क्रीन पर, सेरिफ़ फ़ॉन्ट की तुलना में बिना-सेरिफ़ फ़ॉन्ट को पढ़ना आसान माना जाता है।
कुछ फ़ॉन्ट उदाहरण
Generic Font Family | Examples of Font Names |
---|---|
Serif | Times New Roman Georgia Garamond |
Sans-serif | Arial Verdana Helvetica |
Monospace | Courier New Lucida Console Monaco |
Cursive | Brush Script MT Lucida Handwriting |
Fantasy | Copperplate Papyrus |
सीएसएस फ़ॉन्ट-पारिवारिक संपत्ति
CSS में, हम font-family
टेक्स्ट के फॉन्ट को निर्दिष्ट करने के लिए प्रॉपर्टी का उपयोग करते हैं।
नोट : यदि फ़ॉन्ट नाम एक से अधिक शब्द है, तो वह उद्धरण चिह्नों में होना चाहिए, जैसे: "टाइम्स न्यू रोमन"।
युक्ति: ब्राउज़र/ऑपरेटिंग सिस्टम के बीच अधिकतम संगतता सुनिश्चित करने के font-family
लिए संपत्ति में "फ़ॉलबैक" सिस्टम के रूप में कई फ़ॉन्ट नाम होने चाहिए। अपने इच्छित फ़ॉन्ट से प्रारंभ करें, और एक सामान्य परिवार के साथ समाप्त करें (यदि कोई अन्य फ़ॉन्ट उपलब्ध नहीं है, तो ब्राउज़र को सामान्य परिवार में एक समान फ़ॉन्ट चुनने दें)। फ़ॉन्ट नामों को अल्पविराम से अलग किया जाना चाहिए। अगले अध्याय में फ़ॉलबैक फोंट के बारे में और पढ़ें ।
उदाहरण
तीन अनुच्छेदों के लिए कुछ भिन्न फ़ॉन्ट निर्दिष्ट करें:
.p1 {
font-family: "Times New Roman", Times, serif;
}
.p2 {
font-family: Arial, Helvetica, sans-serif;
}
.p3 {
font-family: "Lucida Console", "Courier New", monospace;
}