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

परिचय

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

सिंटैक्स

object.style.fontVariant = "normal|small-caps|initial|inherit"

मान और विवरण

मान	विवरण
`normal`	फॉन्ट को सामान्य पर सेट करता है और यह डिफ़ॉल्ट मान है।
`small-caps`	फॉर्म को स्मॉल कैपिटल अक्षरों में प्रदर्शित करता है।
`initial`	इस प्रॉपर्टी को उसके प्रारंभिक मान पर सेट करता है।
`inherit`	पैरेंट एलिमेंट से प्रॉपर्टी मान विरासत में लेता है।

उदाहरण

<!DOCTYPE html>
<html>
<head>
<style>
  #demo2, #demo1 {
    font-family: 'times new roman';
    font-size: 25px;
  }
</style>
<script>
  function changeFontVariant() {
    document.getElementById("demo1").style.fontVariant = "small-caps";
    document.getElementById("demo2").style.fontVariant = "small-caps";
    document.getElementById("Sample").innerHTML = "फॉन्ट वेरिएंट को स्मॉल कैप्स में बदल दिया गया है";
  }
</script>
</head>
<body>
  <div id="demo1">यह डेमो टेक्स्ट है</div>
  <div id="demo2">यह डेमो टेक्स्ट है</div>
  <p>ऊपर के divs के अंदर टेक्स्ट का फॉन्ट वेरिएंट प्रॉपर्टी बदलने के लिए नीचे दिए गए बटन पर क्लिक करें</p>
  <button onclick="changeFontVariant()">फॉन्ट वेरिएंट बदलें</button>
  <p id="Sample"></p>
</body>
</html>

आउटपुट

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

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

"फॉन्ट वेरिएंट बदलें" बटन पर क्लिक करने के बाद (स्मॉल कैप्स):

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