CSS का उपयोग करके तत्वों के आसपास मार्जिन स्पेस सेट करना

CSS मार्जिन प्रॉपर्टी का उपयोग उसकी सीमाओं के आसपास चयनित तत्व के मार्जिन क्षेत्र को सेट करने के लिए किया जाता है। मार्जिन प्रॉपर्टी मार्जिन-टॉप, मार्जिन-राइट, मार्जिन-बॉटम और मार्जिन-लेफ्ट के लिए शॉर्टहैंड है।

सिंटैक्स

CSS मार्जिन प्रॉपर्टी का सिंटैक्स इस प्रकार है -

चयनकर्ता { मार्जिन:/*value*/}

निम्नलिखित उदाहरण CSS मार्जिन गुण को दर्शाते हैं -

उदाहरण

  <सिर> <शैली> बॉडी * {डिस्प्ले:फ्लेक्स; नाव छोड़ी; मार्जिन:10px 15px; सीमा:पतली ठोस; पाठ-संरेखण:केंद्र; चौड़ाई:40%; सीमा-त्रिज्या:5%; बॉक्स-छाया:0 0 4px 1px ग्रे;}p { फॉन्ट-फ़ैमिली:"सिम सन", मोनोस्पेस; बैकग्राउंड-कलर:लाइटसियान;}डिव {फ़ॉन्ट-फ़ैमिली:इम्पैक्ट, कर्सिव; बैकग्राउंड-कलर:लाइटग्रीन;}

पहला डेमो टेक्स्ट
डेमो लाइन कुछ इस तरह है..
 
आउटपुट
 

 यह निम्न आउटपुट देता है -
 
 
 
उदाहरण
 
<शैली>टेबल, टेबल * { मार्जिन:5% 30%; सीमा:12px डबल लाल; गद्दी:0.5rem; सीमा-त्रिज्या:30px;}td:nth-child(even) { background-color:lightblue;}td:nth-child(odd) { background-color:lightgreen;} 
 
आउटपुट
 

 यह निम्न आउटपुट देता है -