Stying Fonts in CSS in Hindi-stying फॉण्ट क्या है?

हेल्लो दोस्तों! आपको CSS के बारे में पीछे बताया जा चुका है आज इस पोस्ट में आपको Stying Fonts in CSS in Hindi के बारे में बताया जा रहा है तो चलिए शुरू करते है

Introduction to CSS font Properties

CSS  के द्वारा आप font(Stying Fonts in CSS in Hindi) की size ,style ,weight ,line-height आदि को change कर सकते है इन सभी को change करने के लिए अलग से एक property बनायीं जाती है

इन property के बारे में निचे दिया जा रहा है

Font-Family property

किसी भी html element या tag के font की family को set करने के लिए आपको font-family property की value के रूप में आप font का name देते है

निचे कुछ font के name दिए गए है जिनका प्रयोग करके आप value के रूप में कर  सकते है

  • Times New Roman
  • Verdana
  • Arial
  • courier
  • serif

और भी font-family होते है इन सभी को आप font की value को define कर सकते है

इसे हम अक example से समझ सकते है

<html>
<head>
<title>font-family property</title>
<style>
h2{
font-family:Arial;
}
</style>
<head>
<body>
<h2>font-family example heading</h2>
</body>
</html>

Font-Style property

CSS की मदद से आप font style change कर सकते है इसके लिए आप font-style property का प्रयोग करते है इस property की value normal,italic और oblique हो सकता है

इस property example निचे दिया गया है

<html>
<head>
<title>font-style property</title>
<style>
h2{
font-style:italic;
}
</style>
<head>
<body>
<h2>font-style example heading</h2>
</body>
</html>

font-Variant property

इस property की मदद से आप font variant define कर सकते है इस property की मदद से आप font को capital letter में show कर सकते है इस property की value normal और small-caps हो सकते है

<html>
<head>
<title>font-variant property</title>
<style>
h2{
font-variant:small-caps;
}
</style>
<head>
<body>
<h2>font-variant example heading</h2>
</body>
</html>

font-weight property

इस property से आप font का weight define कर सकते है ये property define करते है की font कितना bold होगा इस property की value bold ,bolder और lighter हो सकता है आप कोई कस्टम font-weight भी define कर सकते है

इसका example निचे दिया गया है

<html>
<head>
<title>font-weight property</title>
<style>
p{
font-weight:bold;
}
</style>
<head>
<body>
<p>font-weight example heading</p>
</body>
</html>

font-size property

इस property के द्वारा आप किसी भी html element के font का size change कर सकते है इस property की value आप pixels भी दे सकते है यहाँ तक की आप pixel के स्थान पर आप % का भी प्रयोग किया जा सकता है

इन सभी का example निचे दिया जा रहा है

<html>
<head>
<title>font-size property</title>
<style>
h2{
font-size:15px;
}
</style>
<head>
<body>
<h2>font-size example heading</h2>
</body>
</html>

font-size-adjust property

इस property के द्वारा आप font की size को adjust कर सकते है जब आप इस property को define कर सकते है तो आप चाहे तो font-family कोई भी ब्राउज़र font की height को ऑटोमेटिकली(automatically) adjust कर देता है

इसका example निचे दिया जा रहा है

<html>
<head>
<title>font-size-adjust property</title>
<style>
p{
font-size-adjust:0.44;
font-family:vendana;
font-size:adjust:0.44;
}
</style>
<head>
<body>
<h2>font-family example heading</h2>
</body>
</html>

font-stretch property

इस property के द्वारा आप font को stretch कर सकते है इस property की value normal,wider,narrower और condensed आदि हो सकता है अब इस property को कोई भी ब्राउज़र support नहीं करता है

हम इसे एक example से समझ सकते है

<html>
<head>
<title>font-family property</title>
<style>
#p1{
font-stretch:wider;
}
</style><head>
<body>
<h2>font-stretch example heading</h2>
<p id=”p1”>this is the font-stretch </p>
</body>
</html>
Stying Fonts in CSS in Hindi

Stying Fonts in CSS in Hindi

reference-https://developer.mozilla.org/en-US/docs/Web/CSS/font

निवेदन :-अगर आपको यह आर्टिकल उपयोगी लगा हो तो इस आप अपने क्लासमेट ,दोस्तों  के साथ अवश्य share कीजिये और आपके जो भी इस पोस्ट्स से related(सम्बन्धित) questions है तो आप उन्हें निचे कमेंट कर सकते है हम उसके  answer अवश्य करेंगे Thank

Leave a Comment