CSS-də margin boşluqları ilə işləmək

İndi biz sayt elementləri arasında boşluq təyin edən margin xassəsi ilə tanış olacağıq. Gəlin praktikada bunun necə göründüyünə baxaq.

Əvvəlcə mən sizə bir-birinin içinə yerləşdirilmiş iki blok göstərəcəm (onlar yapışacaq və biz ikiqat sərhəd görəcəyik):

html<div id="parent">
  <div id="child"></div>
</div>

css#parent {
  width: 300px;
  border: 1px solid red;
}
#child {
  height: 100px;
  border: 1px solid green;
}

Результат:

İndi isə gəlin daxili bloka 30px margin təyin edək:

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;
}

Результат: