- Introduction to CSS font properties in Hindi
- properties font family with CSS in Hindi
- properties font style with CSS in Hindi
Introduction to Font Properties
जब भी html मे paragraph लिखते है | तो वहा पर normal font show होती है | अगर heading लिखते है | तो अलग font show होती है | यह html की by default font property होती है |
जो html tags के through मिलती है | लेकिन css का use करके font को change कर सकते है | यानी अपने according font को change किया जा सकता है |
Font-family Property
जब भी हम font को change करना चाहते है | तो हमे font-family property का use करना पड़ता है | लेकिन font-family property मे कुछ values दी जाती है | जिनका नाम हम निचे दे रहे है |
- Verdana
- Arial
- Courier
- serif
- cursive
- initial
- inherit
- sans-serif
ऊपर दिये गये blocks मे font-family property की कुछ values दी गयी है | जिनका use font को change करने के लिए किया जाता है |
<html> <head> <style type="text/css"> h1 { font-family: cursive;} </style> </head> <body> <h1>Esay</h1> </body> </html>
font-stretch Property
Css मे इस property के द्वारा font को stretch किया जाता है। font-stretch property की value normal, expanded, unset और semi-condensed आदि हो सकते है। अब इस property को कोई भी browser support नहीं करता है।
<html> <head> <style type="text/css"> h1 { font-stretch: unset; } </style> </head> <body> <h1>Esay Hindi Tutorials</h1> </body> </html>
font-size-adjust Property
font-size-adjust Property के द्वारा font की size adjust करते हैं। जब font-size adjust Property को define करते है | तो font का height automatically adjust हो जाता है | निचे example दिया जा रहा है |
<html> <head> <style type="text/css"> #p1 { font-size-adjust : 0.14; } </style> </head> <body> <p id="p1">Esay Hindi Tutorials</p> </body> </html>
Font-size Property
font-size Property का use font को resize करने के लिए किया जाता है | इसकी value आप px ( pixel ) मे दे सकते है | अगर आप चाहे तो इसका value % ( percentage ) मे भी दे सकते है | निचे example दिया जा रहा है |
<html> <head> <style type="text/css"> #p1 { font-size : 30px; } #p2 { font-size : 40%; } </style> </head> <body> <p id="p1">Esay Hindi Tutorials</p> <p id="p2">Esay Hindi Tutorials</p> </body> </html>
Font-style Property
font-style Property के द्वारा font का style change किया जाता है | font-style property की values normal, italic, inherit, oblique और initial हो सकती हैं। इसका example निचे दिया जा रहा है।
<html> <head> <style type="text/css"> #p1 { font-style: italic; } #p2 { font-size : initial; } </style> </head> <body> <p id="p1">Esay Hindi Tutorials</p> <p id="p2">Esay Hindi Tutorials</p> </body> </html>
Font-variant Property
Font-variant Property के द्वारा आप font का variants change कर सकते है। Font-variant Property के द्वारा font को capital letters में show किया जाता है। इस property की values normal, unset, initial, inherit, और small-caps हो सकती है। इसका example निचे दिया जा रहा है।
<html> <head> <style type="text/css"> #p1 { font-variant: small-caps; } #p1 { font-variant: unset; } </style> </head> <body> <p id="p1">Esay Hindi Tutorials</p> <p id="p2">Esay Hindi Tutorials</p> </body> </html>
Font-weight Property
font-weight Property के द्वारा font का weight कम या जादा कर सकते है। font-weight Property यह define करती है | की हमारा font कितना bold या bolder होगा | font-weight Property की value numerical और alphabetical दोनों दे सकते है | निचे example दिया जा रहा है |
<html> <head> <style type="text/css"> #p1 { font-weight: 900; } #p2 { font-weight: bold; } #p3 { font-weight: bolder; } </style> </head> <body> <p id="p1">Esay Hindi Tutorials</p> <p id="p2">Esay Hindi Tutorials</p> <p id="p3">Esay Hindi Tutorials</p> </body> </html>
CSS Property & Values | CSS Text Properties |
Previous | Next |
---|