CSS in Hindi – Introduction to Margin Properties

  • Introduction to margin properties in Hindi
  • CSS position properties in Hindi
  • CSS margin properties in Hindi

Margin Property

अगर आप css सिख रहे है तो margin property अछे से जान लीजिए क्योकि margin बहुत ही important topic है | हमारे web page के लिए |

Css मे margin का use positioning के लिए किया जाता है यानी जो हम web page develop करते है उस page का कौन element कहा पर दिखाई देगा इसे manage करते है margin property के जरिये |

क्योकि बिना margin property के हम web page को जहा पर चाहते है वहा नही दिखा सकते है | margin property का use करना काफी आसन है बस पूरा article पड़े |

CSS मे margin property का use html के हर tags पर किया जाता है | या कर सकते है | example h1 to h6, image tag, table, Sub menu, paragraph आदि |

Css मे margin property का value pixel मे दे सकते है और percentage मे भी दे सकते है margin property के साथ 4 time value दी जाती है और अगर हम चाहे तो 2 time value भी दे सकते है जो top और left के लिए work करेगी | अब निचे दिये गये code देखे |

आप margin property का value auto भी दे सकते है और जब आप auto property का use करते है तो 
browser automatically appropriate margin set कर लेता है |

<html>
<head>
<style type="text/css">
#p1 { margin: 50px 20px 30px 40px; }
</style>
</head>
<body>
<p id="p1">Easy Hindi Tutorials is a best blog of computer programming</p>
</body>
</html>

ऊपर दिये गये margin property मे पहला value 50px है यह value top position के लिए work कर रही है और दूसरी value 20px है यह value right position के लिए work कर रही है और तीसरा value 30px है यह value bottom के लिए work कर रही है और चौथा value 40px है यह value left side के लिए work कर रही है | अब आप margin property के values के बारे मे जान गये होंगे की कौन सा value किसके लिए work कर रही है |

margin-top Property

Css मे margin top property भी use किया जाता है जब आप margin top property का use करते है तो सिर्फ top के लिए margin apply होता है और इसकी value एक ही बार दी जाती है | value pixel मे भी हो सकती है और percentage मे भी हो सकती है |

<html>
<head>
<style type="text/css">
#p1 { margin-top: 20px; }
#p2 { margin-top: 20%; }
</style>
</head>
<body>
<p id="p1">Easy Hindi Tutorials is a best blog of computer programming</p>
<p id="p2">Easy Hindi Tutorials is a best blog of computer programming</p>
</body>
</html>

margin-left Property 

Css मे margin left property का भी use किया जाता है और जब आप margin left property का use करते है तो सिर्फ left के लिए work करती है यहाँ पर भी value pixel या percentage मे दे सकते है |

<html>
<head>
<style type="text/css">
#p1 { margin-left: 20px; }
#p2 { margin-left: 20%; }
</style>
</head>
<body>
<p id="p1">Easy Hindi Tutorials is a best blog of computer programming</p>
<p id="p2">Easy Hindi Tutorials is a best blog of computer programming</p>
</body>
</html>

margin-bottom Property

Css मे bottom property का use बहुत कम किया जाता है पर margin bottom property का use किया जाता है और जब आप margin bottom property का use करते है तो यह सिर्फ bottom के लिए work करती है और इसका भी value pixel या percentage मे दे सकते है |

<html>
<head>
<style type="text/css">
#p1 { margin-bottom: 20px; }
#p2 { margin-bottom: 20%; }
</style>
</head>
<body>
<p id="p1">Easy Hindi Tutorials is a best blog of computer programming</p>
<p id="p2">Easy Hindi Tutorials is a best blog of computer programming</p>
</body>
</html>

margin-right Property

Css मे margin right property का use किया जाता है और यह property only right side के लिए work करती है इसका भी value pixel या percentage मे दे सकते है |

<html>
<head>
<style type="text/css">
#p1 { margin-right: 20px; }
#p2 { margin-right: 20%; }
</style>
</head>
<body>
<p id="p1">Easy Hindi Tutorials is a best blog of computer programming</p>
<p id="p2">Easy Hindi Tutorials is a best blog of computer programming</p>
</body>
</html>

ऊपर दिये गये code मे या article मे अगर आपको कुछ भी समझ मे नही आया तो आप हमसे contact कर सकते है |

CSS Border Properties CSS Padding Property
Previous Next