HTML <font> टैग: फॉन्ट रंग, फेस, आकार (अप्रचलित)

HTML <font> टैग

<font> टैग टेक्स्ट का फॉन्ट रंग (color), फॉन्ट परिवार (face), और फॉन्ट आकार (size) सेट करने के लिए उपयोग किया जाता था।

⚠️ अप्रचलित: <font> टैग HTML5 में समर्थित नहीं है। सभी टेक्स्ट स्टाइलिंग के लिए CSS का उपयोग करें।

पुराने एट्रिब्यूट्स

एट्रिब्यूट	विवरण	CSS विकल्प
color	फॉन्ट रंग सेट करता है	color
face	फॉन्ट फेस (परिवार) सेट करता है	font-family
size	फॉन्ट आकार सेट करता है (1-7)	font-size

पुराना उदाहरण (केवल संदर्भ)

<!DOCTYPE html>
<html>
<body>
  <h2>फॉन्ट्स के साथ खेलना</h2>
  <p>विभिन्न फॉन्ट्स प्रदर्शित:</p>
  <p><font face="arial" size="20" color="yellow">डेमो टेक्स्ट!</font></p>
  <p><font size="10" color="gray">डेमो टेक्स्ट!</font></p>
  <p><font size="15" face="verdana" color="magenta">डेमो टेक्स्ट!</font></p>
  <p><font size="8" face="calibri" color="magenta">डेमो टेक्स्ट!</font></p>
</body>
</html>

आधुनिक CSS दृष्टिकोण

/* CSS क्लासेस */
.font-demo-1 {
  font-family: Arial, sans-serif;
  font-size: 20px;
  color: yellow;
}

.font-demo-2 {
  font-size: 10px;
  color: gray;
}

.font-demo-3 {
  font-family: Verdana, sans-serif;
  font-size: 15px;
  color: magenta;
}

/* HTML में */
<p class="font-demo-1">डेमो टेक्स्ट!</p>
<p class="font-demo-2">डेमो टेक्स्ट!</p>
<p class="font-demo-3">डेमो टेक्स्ट!</p>

इंलाइन स्टाइल (त्वरित उपयोग के लिए)

<p style="font-family: Calibri; font-size: 16px; color: magenta;">डेमो टेक्स्ट!</p>

फॉन्ट आकार इकाइयाँ

px: निरपेक्ष पिक्सेल
em: पैरेंट के सापेक्ष
rem: रूट के सापेक्ष (अनुशंसित)
%: पैरेंट के प्रतिशत
vw/vh: व्यूपोर्ट सापेक्ष