CSS Margin Tutorial in Hindi – Part 6

आज इस आर्टिकल में हम आपको CSS Margin Tutorial in Hindi – Part 6 के बारे में बता रहे है.

CSS के margin property का इस्तेमाल element के चारों ओर space बनाने के लिए किया जाता है. यह element के बाहर और किसी define किये border के बाहर space बनाने के लिए इस्तेमाल होता है.

ज्यादातर margin की अलग अलग property का इस्तेमाल किया जाता है जैसे अगर हमने किसी element में टॉप से margin चाहिए या फिर किसी दूसरी side से.

  • margin-top
  • margin-right
  • margin-bottom
  • margin-left

इन चार अलग अलग property का इस्तेमाल करके हम किसी भी element की किसी भी side में space add कर सकते है. इनकी value हम auto, px, mm, em और % में दे सकते है और इनकी value नेगेटिव भी रखी जा सकती है.

Example

h1{
    margin-top: 100px;
    margin-bottom: 100px;
    margin-right: 150px;
    margin-left: 80px;
}

ऊपर तो हमने आपको अलग अलग property का इस्तेमाल करने के बारे में बताया है. लेकिन अगर आप इसका इस्तेमाल एक साथ करना चाहते है तो ऐसा भी कर सकते है. इसके लिए आपको उसके side की property इस्तेमाल करने की जरूरत नही है.

CSS Margin
CSS Margin

Example

h1{
    margin: 25px 50px 75px 100px;
}

इस प्रकार हम सभी value एक साथ दे कर चारों तरफ के margin को सेट कर सकते है.

अगर हम margin property में चार value देते है तो सबसे पहली value top margin सेट करती है दूसरी value right margin सेट करती है तीसरी value bottom margin को सेट करती और सबसे लास्ट में लिखी गयी value left side के margin को सेट करती है.

Example 2

h1{
    margin: 25px 50px 75px;
}

अगर हम margin में 3 ही value देते है तो सबसे पहली value top margin सेट करती है दूसरी value right और left margin सेट करती है और सबसे लास्ट में लिखी गयी value bottom side के margin को सेट करती है.

Example 3

h1{
    margin: 25px 75px;
}

अगर हम margin में 2 ही value देते है तो सबसे पहली value top और bottom margin सेट करती है और दूसरी value right और left margin सेट करती है.

Example 4

h1{
    margin: 75px;
}

अगर हम सिर्फ एक value ही margin को देते है तो चारों side एक ही value automatic सेट हो जाती है और आपको सभी तरफ से समान margin मिलता है.

Example 5

h1{
width:300px;

    margin: auto;
}

CSS Auto Margin
CSS Auto Margin

इसका इस्तेमाल तब किया जाता है जब आपको किसी element को horizontally center में align करना हो. लेकिन एक बात का ध्यान रखे इसके लिए आपको उस element की width define करनी बहुत जरुरी है इसके बिना margin की auto value काम नही करेगी.

CSS Padding Tutorial in Hindi – Part 7>>>>>>

Be the first to comment

Leave a Reply

Your email address will not be published.


*