CSS property value type in hindi-css प्रॉपर्टी वैल्यू टाइप क्या है?

by

हेल्लो दोस्तों! आज इस article में CSS क्या होता है कैसे काम करता है इसका पूरा नाम क्या है CSS property value type in hindi  आदि सभी के बारे में दिया गया है तो चलिए शुरू करते है 

Donation

Introduction to CSS Property Value Types

जब भी कोई CSS property define करते है तो उसके साथ उसकी value भी define की जाती है। अलग अलग properties के लिए अलग अलग type की values define की जाती है।

उदाहरण के लिए width और height properties के लिए numeric values define की जाती है और color, background आदि properties लिए color का नाम और hex value प्रयोग की जाती है।

CSS में कई value types available है। इन्हें चार मुख्य categories में divide किया गया है।

  • Numeric Value types – px, em, cm, pt आदि। 
  • Percentage value type– Percentage के रूप में define की जाने वाली values 
  • Color value types – Color name, hexadecimal color value, RGB color value
  • Function value types – url(), rotate(), translate() आदि। 

इन सभी categories के बहुत से value types CSS में available  है। आगे हर category के कुछ value types के बारे में बताया जा रहा है जिन्हें आप frequently use करेंगे। 

CSS Numerical Value Types

CSS में ऐसी बहुत सी properties available है जिनकी values numeric (सँख्या के रूप में) define की जाती है। कुछ ऐसी ही properties की list निचे दी जा रही है जिनकी value numeric define की जाती है।

  • width 
  • height
  • margin
  • padding
  • font-size आदि। 

CSS में properties की कई type की numeric values define की जा सकती है। CSS में available numeric values types के बारे में निचे detail से बताया जा रहा है।

  • px – यह type value pixels में define करने के लिए use किया जाता है। जितनी numeric value इस type के साथ define की जाती है उतने ही pixels द्वारा element effect होता है। 
  • em – यह एक relative value type है। यह value type current value के relation में define किया जाता है। उदाहरण के लिए यदि आप किसी font की size 2em define करते है तो इसका मतलब current font size का दुगना size होगा। 
  • cm – यह type property की value centi meter में define करने के लिए प्रयोग किया जाता है। 
  • pt – यह type property की value points में define करने के लिए use किया जाता है। इस type को mostly print media types के लिए use किया जाता है। 
  • mm – यह type property की value millimetre के रूप में define define करने के लिए प्रयोग किया जाता है। 

Example 

निचे CSS numeric value type का example दिया जा रहा है। 

<html>   <head>
<style>
h1, p{
margin-left:20px;
font-size:20pt;
}
</style>
</head> <body>
<h1>CSS Numeric Types Example</h1>
<p>This is paragraph</p>
</body> </html>

ऊपर दिया गया उदाहरण निचे दिया गया output generate करता है।

CSS Percentage Value Type

जिन properties की value आप numeric में define करते है उनमें से ज्यादातर properties की value आप percentage में भी define कर सकते है। Percentage value उन situations में suitable रहती है जब आप किसी element की value screen की size के सन्दर्भ में change करना चाहते है।

जिन elements की value percentage में define की जाती है उनकी size screen के अनुसार changeable होती है। लेकिन जब आप दूसरे numeric types को use करते है तो elements की value fix हो जाती है।

उदाहरण के लिए यदि आप किसी paragraph की width 30% define करते है तो उस paragraph को जिस भी screen पर देखा जाएगा उसकी 30% width में वह पैराग्राफ show होगा।

निचे कुछ properties  की list दी जा रही है जिनकी value percentage में define की जा सकती है।

  • margin 
  • padding
  • font-size
  • border
  • color
  • width
  • height

Example

Percentage value type का उदाहरण निचे दिया जा रहा है। 

<html>   <head>
<style>
p
{
    width:30%;
}
</style>
</head> <body>
<h1>Percentage Value Type Example</h1>
<p>Width of this paragraph is set using percentage value type</p>
</body> </html>

ऊपर दिया गया उदाहरण निचे दिया गया output generate करता है।

CSS Color Value Types

CSS में ऐसी कई properties है जिनकी value color के रूप में define की जाती है। जैसे की color, background-color आदि properties की value color के रूप में define की जाती है। 

CSS में 3 मुख्य color types available है। इनके द्वारा आप किसी भी value की color value define कर सकते है। 

  • Name – Color value define करने के लिए आप directly color का नाम define कर सकते है। 
  • Hex Value – किसी color की hex value को भी आप property की value के रूप में define कर सकते है। 
  • RGB – Red, Green और Blue colors की अलग अलग values के रूप में भी आप color को define कर सकते है। 

Example 

निचे color value types का example दिया जा रहा है। 

<html>   <head>
<style>
body
{
    background-color:pink;
}
h1
{
    color:#f07c82;
}
p
{
   color:rgb(0,0,255);
}
</style>
</head> <body>
<h1>Color Value Types Example</h1>
<p>Background is set using color name, heading color is set using hex value of color and paragraph color is set using rgb function of color property.</p>
</body> </html>

ऊपर दिया गया उदाहरण निचे दिया गया output generate करता है।

CSS Function Value Types

CSS में कई ऐसी भी properties है जिनकी values function के रूप में define की जाती है। जैसे की यदि आप कोई background image network पर से अपने webpage में include करना चाहते है तो इसके लिए आप background property की value के रूप में url() function define करते है और उसमे उस image का address pass करते है।

इसी प्रकार transform property की value rotate(), translate() आदि functions के रूप में define की जाती है। इसके अलावा background-color property की value rgba() और hsla() functions के रूप में define की जा सकती है।

Example 

निचे function value type का उदाहरण दिया जा रहा है। 

<html>   <head>
<style>
body
{
    background:url(/images/flowers/lotus.jpg);
}
</style>
</head> <body>
<h1>Function Value Type Example</h1>
<p>Background of this page is added using url() function value of background property.</p>
</body> </html>

ऊपर दिया गया उदाहरण निचे दिया गया output generate करता है।

CSS property value type in hindi

reference-https://www.w3schools.com/cssref/pr_class_display.asp

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

Leave a Comment