R.I.B.H.U. Academy^®

फॉन्ट-परिवार

आमतौर पर वेब-पेजों में चार प्रकार के फॉन्ट-फैमिली का उपयोग किया जाता है:

<p style="font-family: monospace;"> TEXT </p>

<p style="font-family: serif;"> TEXT </p>

<p style="font-family: sans-serif;"> TEXT </p>

<p style="font-family: cursive;"> TEXT </p>

    कुछ ऑपरेटिंग सिस्टम, उदाहरण के लिए माइक्रोसॉफ्ट विंडोज कुछ फ़ॉन्ट-परिवारों का समर्थन करता है, जैसे कि "Times New Roman", जबकि अन्य, मैक (एप्पल) ओएस, आदि दुसरे फ़ॉन्ट-परिवारों का समर्थन करता है, जैसे कि "Times", (यहां उल्लेख किया गया) दोनों फ़ॉन्ट-परिवारों "serif" वर्ग के हैं।

    यदि आप जानना चाहते हैं कि आपके ऑपरेटिंग सिस्टम (OS) में कौन से फ़ॉन्ट-फ़ैमिली स्थापित हैं, तो बस (उदाहरण के लिए, MS Windows OS में) Paint या WordPad या अन्य समान एप्लिकेशन खोलें । आप शीर्ष टूलबार (मेनू बार के ठीक नीचे), A या Calibri देखेंगे, और जब आप उस पर बाईं-माउस-बटन के साथ क्लिक करेंगे, तो आपको विभिन्न फ़ॉन्ट-परिवारों के नाम की एक लंबी सूची मिलेगी।

    "serif " वर्ग के फ़ॉन्ट-परिवारों में टोपी (HAT) और बूट (BOOT) (जैसे कुछ देशों के पुलिस विभाग में 'सेरिफ़') होते हैं। एक शब्द वाले फॉन्ट-फैमिली के नाम बिना सिंगल-कोट्स के लिखे जाते हैं, लेकिन जब कोई फॉन्ट-फैमिली नाम कई शब्द होते हैं, तो इसे सिंगल-कोट्स के भीतर लिखा जाता है। निम्नलिखित अक्षरों पर विचार करें:

<p style="font-family: times, serif;"> TEXT </p>

<p style="font-family: 'Times New Roman', serif;"> TEXT </p>

<p style="font-family: Georgia, serif;"> TEXT </p>

    "sans-serif" (जिसका अर्थ पुलिस विभाग में 'सेरिफ़' नहीं है, जैसा कि ऊपर उल्लेख किया गया है) श्रेणी के फॉन्ट-फ़ैमिली टोपी (HAT) और बूट (BOOT) के बिना हैं। आप अपने WEB-PAGES में चार प्रकार के फ़ॉन्ट-परिवारों में से किसका उपयोग करना चाहते हैं, यह आपकी पसंद है। आपको एक ही प्रकार के कम से कम तीन फ़ॉन्ट-पारिवारिक नाम (आमतौर पर MS-Windows, Apple-Mac, Linux OS में उपयोग हेतु) एक HTML तत्व, या 'चयनकर्ता' (CSS में लागू) के लिए लिखने चाहिए। निम्नलिखित अक्षरों पर विचार करें:

<p style="font-family: Helvetica, sans-serif;"> TEXT </p>

<p style="font-family: Verdana, sans-serif;"> TEXT </p>

<p style="font-family: 'Trebuchet MS', sans-serif;"> TEXT </p>

    कुछ फोंट दूसरों की तुलना में बड़े होते हैं, कुछ में अधिक वजन (बोल्ड) होता है, और कुछ इटैलिक होते हैं। font-size फ़ॉन्ट-फ़ैमिली की तुलना में अलग property है, और पूर्व (font-size) का मूल्य (value) माप के विभिन्न यूनिटों में है। font-weight भी फॉन्ट-फैमिली से अलग प्रॉपर्टी है, हालांकि, पुराने दिनों में सीमित विकल्प होते हैं: normal, bold, bolder । इसलिए, एक ही परिवार में उच्च फ़ॉन्ट-भार के लिए अलग-अलग नाम प्रदान किए गये हैं। उदाहरण के लिए:

<p style="font-family: Arial, sans-serif;"> TEXT </p>

<p style="font-family: arial-black, sans-serif;"> TEXT </p>

<p style="font-family: 'Arial Black', sans-serif;"> TEXT </p>

    वेब-डेवलपर्स यह नहीं जानते हैं कि ग्राहक/उपयोगकर्ता के कंप्यूटर में कौन से फ़ॉन्ट-परिवार स्थापित हैं, इसलिए जब वे एक HTML तत्व या एक चयनकर्ता के लिए, विशिष्ट फ़ॉन्ट परिवार का उल्लेख कर रहे हों तो अंत में या तो serif, sans-serif, monospace या cursive जोड़ना सामान्य (CSS के रूप में) नियम है।

<p style="font-family: 'Lucida Console', monospace;"> TEXT </p>

<p style="font-family: 'Courier New', Courier, monospace;"> TEXT </p>

    आप निम्नलिखित उदाहरणों में देख सकते हैं कि एक ही प्रकार के कई फॉन्ट-फैमिली नाम लिखे गए हैं, एक दूसरे से अलग करने के लिए , (अल्पविराम) और 'बहु-शब्द नाम' एकल-उद्धरणों (pair of two single quotes) में लिखे गए हैं।

    <p style="font-family: Verdana, Geneva, Tahoma, sans-serif;"> TEXT </p>

    <p style="font-family: Arial, Helvetica, sans-serif;"> TEXT </p>

    <p style="font-family: Georgia, 'Times New Roman', Times, serif;"> TEXT </p>

    <p style="font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, sans-serif;"> TEXT </p>

    हालाँकि, आधुनिक दिनों में, जब इंटरनेट की गति और डेटा-सेवाएँ पुराने दिनों की तुलना में अधिक तेज़ और सस्ती हैं, तो कई ऑनलाइन (उदाहरण के लिए, Google फोंट) या ऑफलाइन (वांछित फोंट डाउनलोड करना, उनमें से कुछ व्यावसायिक उपयोग के लिए स्वतंत्र रूप से उपलब्ध हैं) , और उन्हें अपने वेब-पेज के स्थानीय रूप से (सापेक्ष पथ में) उपयोग करें। आप विभिन्न फ़ॉन्ट-परिवारों का उपयोग करने के तरीके के बारे में CSS विषय (topic) में अधिक जानेंगे ।

<style type="text/css">
  @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Work+Sans:wght@400;500&display=swap");
  body { font-family: 'Work Sans', sans-serif; }
  h1, h2, h3, h4, h5, h6 { font-family: 'Poppins', sans-serif; }
/* फ़ॉन्ट-फ़ैमिली प्रमाणित स्रोत से डाउनलोड करने के बाद, और व्यावसायिक रूप से उपयोग करने की अनुमति होने के बाद, निम्नलिखित उदाहरण की तरह लागू किया जा सकता है: */
  @font-face { font-family: myFont; /* myFont वेब-पेजों में उपयोग करने हेतु कस्टम नाम है। */ src: url('./ChopinScript.ttf'); }
  p { font-family: myFont; } /* अब, यह फ़ॉन्ट-परिवार सभी <p> </p> HTML तत्व पर लागू होगा, जहाँ आप इसे लिंक करते हैं। */
</style>

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

    𝒜 ℬ 𝒞 𝒟 ℰ ℱ 𝒢 ℋ ℐ 𝒥 𝒦 ℒ ℳ 𝒩 𝒪 𝒫 𝒬 ℛ 𝒮 𝒯 𝒰 𝒱 𝒲 𝒳 𝒴 𝒵

    &Ascr; &Bscr; &Cscr; &Dscr; &Escr; &Fscr; &Gscr; &Hscr; &Iscr; &Jscr; &Kscr; &Lscr; &Mscr; &Nscr; &Oscr; &Pscr; &Qscr; &Rscr; &Sscr; &Tscr; &Uscr; &Vscr; &Wscr; &Xscr; &Yscr; &Zscr;

    𝒶 𝒷 𝒸 𝒹 ℯ 𝒻 ℊ 𝒽 𝒾 𝒿 𝓀 𝓁 𝓂 𝓃 ℴ 𝓅 𝓆 𝓇 𝓈 𝓉 𝓊 𝓋 𝓌 𝓍 𝓎 𝓏

    &ascr; &bscr; &cscr; &dscr; &escr; &fscr; &gscr; &hscr; &iscr; &jscr; &kscr; &lscr; &mscr; &nscr; &oscr; &pscr; &qscr; &rscr; &sscr; &tscr; &uscr; &vscr; &wscr; &xscr; &yscr; &zscr;

    𝔸 𝔹 ℂ 𝔻 𝔼 𝔽 𝔾 ℍ 𝕀 𝕁 𝕂 𝕃 𝕄 ℕ 𝕆 ℙ ℚ ℝ 𝕊 𝕋 𝕌 𝕍 𝕎 𝕏 𝕐 ℤ

    &Aopf; &Bopf; &Copf; &Dopf; &Eopf; &Fopf; &Gopf; &Hopf; &Iopf; &Jopf; &Kopf; &Lopf; &Mopf; &Nopf; &Oopf; &Popf; &Qopf; &Ropf; &Sopf; &Topf; &Uopf; &Vopf; &Wopf; &Xopf; &Yopf; &Zopf;

    𝕒 𝕓 𝕔 𝕕 𝕖 𝕗 𝕘 𝕙 𝕚 𝕛 𝕜 𝕝 𝕞 𝕟 𝕠 𝕡 𝕢 𝕣 𝕤 𝕥 𝕦 𝕧 𝕨 𝕩 𝕪 𝕫

    &aopf; &bopf; &copf; &dopf; &eopf; &fopf; &gopf; &hopf; &iopf; &jopf; &kopf; &lopf; &mopf; &nopf; &oopf; &popf; &qopf; &ropf; &sopf; &topf; &uopf; &vopf; &wopf; &xopf; &yopf; &zopf;

कुछ अन्य फ़ॉन्ट-परिवार:

<p style="font-family: 'Segoe Script';"> TEXT </p>

<p style="font-family: 'Segoe Print';"> TEXT </p>

<p style="font-family: fantasy;"> TEXT </p>

<p style="font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;"> TEXT </p>