फ़ॉन्ट-फैमिली गुण

font-family गुण फ़ॉन्ट का प्रकार निर्धारित करता है।

सिंटैक्स

cssसिलेक्टर {
  font-family: फ़ॉन्ट का नाम;
}

टिप्पणी

यदि फ़ॉन्ट के नाम में स्पेस हो, उदाहरण के लिए, Times New Roman, तो इसे सिंगल या डबल कोट्स में बंद करना चाहिए।

टिप्पणी

कॉमा से अलग करके कई समान फ़ॉन्ट्स की सूची बनाई जा सकती है। जब ब्राउज़र सूची में पहला फ़ॉन्ट पाता है, तो वह उपयोगकर्ता के कंप्यूटर पर उसकी उपलब्धता की जांच करता है। यदि ऐसा कोई फ़ॉन्ट मौजूद नहीं है, तो अगला फ़ॉन्ट लिया जाता है और उपस्थिति के लिए उसका भी विश्लेषण किया जाता है। इसलिए कई फ़ॉन्ट्स होने से संभावना बढ़ जाती है कि उनमें से कम से कम एक क्लाइंट के कंप्यूटर पर मिल जाएगा।

सूची को आमतौर पर एक कीवर्ड के साथ समाप्त किया जाता है, जो फ़ॉन्ट के प्रकार का वर्णन करता है (सभी फ़ॉन्ट्स किसी न किसी प्रकार के होते हैं) - serif, sans-serif, cursive, fantasy या monospace। यदि ब्राउज़र को उपयोगकर्ता के कंप्यूटर पर निर्दिष्ट कोई भी फ़ॉन्ट नहीं मिलता है, तो वह निर्दिष्ट प्रकार का कोई एक फ़ॉन्ट चुन लेगा।

फ़ॉन्ट्स के प्रकार

प्रकार विवरण
serif सेरिफ़ वाला फ़ॉन्ट।
sans-serif बिना सेरिफ़ वाला फ़ॉन्ट।
cursive कर्सिव फ़ॉन्ट।
fantasy सजावटी फ़ॉन्ट जिसमें सुंदर कर्ल और असामान्य प्रभाव होते हैं।
monospace मोनोस्पेस फ़ॉन्ट, जिसमें प्रत्येक वर्ण की चौड़ाई समान होती है।

डिफ़ॉल्ट मान: ब्राउज़र में डिफ़ॉल्ट रूप से सेट फ़ॉन्ट। आमतौर पर यह Times New Roman होता है।

उदाहरण

फ़ॉन्ट को Arial परिवार नियत करते हैं:

html<p>
  Lorem ipsum dolor sit amet.
</p>
cssp {
  font-family: Arial;
}

Результат:

उदाहरण

फ़ॉन्ट को Times New Roman परिवार नियत करते हैं। चूंकि फ़ॉन्ट का नाम कई शब्दों से बना है, तो इसे कोट्स में लेते हैं:

html<p>
  Lorem ipsum dolor sit amet.
</p>
cssp {
  font-family: "Times New Roman";
}

Результат:

उदाहरण

फ़ॉन्ट को serif समूह का फ़ॉन्ट नियत करते हैं (संभवतः Times New Roman लिया जाएगा):

html<p>
  Lorem ipsum dolor sit amet.
</p>
cssp {
  font-family: serif;
}

Результат:

उदाहरण

फ़ॉन्ट को sans-serif समूह का फ़ॉन्ट नियत करते हैं (संभवतः Arial लिया जाएगा):

html<p>
  Lorem ipsum dolor sit amet.
</p>
cssp {
  font-family: sans-serif;
}

Результат:

उदाहरण

फ़ॉन्ट को fantasy समूह का फ़ॉन्ट नियत करते हैं (आपके सिस्टम पर ऐसे फ़ॉन्ट की अनुपस्थिति के कारण यह काम नहीं भी कर सकता है):

html<p>
  Lorem ipsum dolor sit amet.
</p>
cssp {
  font-family: fantasy;
}

Результат:

उदाहरण

फ़ॉन्ट को monospace समूह का फ़ॉन्ट नियत करते हैं (अक्षर एक जैसे आकार के हो जाएंगे):

html<p>
  Lorem ipsum dolor sit amet.
</p>
cssp {
  font-family: monospace;
}

Результат: