सीएसएस में मार्जिन इंडेंटेशन के साथ काम करना

अब हम margin प्रॉपर्टी को समझेंगे, जो वेबसाइट के एलिमेंट्स के बीच इंडेंटेशन सेट करती है। आइए देखें कि यह व्यवहार में कैसा दिखता है।

शुरुआत के लिए मैं आपको एक दूसरे के अंदर नेस्टेड दो ब्लॉक्स दिखाता हूँ बिना margin के (वे आपस में चिपक जाएंगे और हमें डबल बॉर्डर दिखाई देगा):

html<div id="parent">
  <div id="child"></div>
</div>
css#parent {
  width: 300px;
  border: 1px solid red;
}
#child {
  height: 100px;
  border: 1px solid green;
}

Результат:

और अब आइए अंदर वाले ब्लॉक को margin 30px से सेट करें:

html<div id="parent">
  <div id="child"></div>
</div>
css#parent {
  width: 300px;
  border: 1px solid red;
}

#child {
  height: 100px;
  border: 1px solid green;
  margin: 30px;
}

Результат:

Задание 1

इस नमूने के अनुसार पेज को दोहराएँ:

Задание 2

इस नमूने के अनुसार पेज को दोहराएँ: