HTML DOM Style fontFamily प्रॉपर्टी

परिचय

HTML DOM Style fontFamily प्रॉपर्टी का उपयोग चयनित एलिमेंट के लिए विशिष्ट फॉन्ट सूची सेट करने या वापस करने के लिए किया जाता है। वेब-सेफ फॉन्ट्स का उपयोग करने और अतिरिक्त फॉन्ट्स निर्दिष्ट करने की सिफारिश की जाती है।

सिंटैक्स

object.style.fontFamily = "font1, font2, etc.|initial|inherit"

यहां, font1, font2 कॉमा से अलग की गई फॉन्ट सूची हैं। यदि पहला फॉन्ट लागू नहीं किया जा सकता, तो दूसरा लागू किया जाता है, और इसी तरह। initial प्रॉपर्टी मान को डिफ़ॉल्ट मान पर सेट करता है जबकि inherit इसे पैरेंट प्रॉपर्टी मान पर सेट करता है।

उदाहरण

<!DOCTYPE html>
<html>
<head>
<style>
  li {
    font-size: 1.1em;
    background-color: snow;
    font-family: cursive;
  }
</style>
<script>
  function changeFontFamily() {
    for(var i = 0; i < 3; i++) {
      document.getElementsByTagName("li")[i].style.fontFamily = "Sans-Serif";
    }
    document.getElementById("Sample").innerHTML = "ऊपर की लिस्ट का फॉन्ट फैमिली अब Helvetica पर सेट है";
  }
</script>
</head>
<body>
  <ul>
    <li>यह लिस्ट आइटम 1 है।</li>
    <li>यह लिस्ट आइटम 2 है</li>
    <li>यह लिस्ट आइटम 3 है</li>
  </ul>
  <p>ऊपर के लिस्ट आइटम्स का फॉन्ट फैमिली बदलने के लिए नीचे दिए गए बटन पर क्लिक करें</p>
  <button onclick="changeFontFamily()">फॉन्ट फैमिली बदलें</button>
  <p id="Sample"></p>
</body>
</html>

आउटपुट

प्रारंभिक स्थिति (cursive फॉन्ट):

HTML DOM Style fontFamily प्रॉपर्टी

"फॉन्ट फैमिली बदलें" बटन पर क्लिक करने के बाद (Sans-Serif):

HTML DOM Style fontFamily प्रॉपर्टी