CSS-마진

 

마진

 

 

 

마진은 선택적인 그리고 어떤 의미에서는 더 간단하게 구성요소의 위치를 설정하는 방법이다. 실습을 위해 divA 와 divB에서 모든 플로팅과 위치 설정규칙을 지우고 아래 코드를 divA에 추가한다. 

  

 

margin:  20px;

 

 

이 코드는 빨간색 div주변에 20픽셀의 여백을 만든다. 다음 그림과 같은 모습이다. 

 

 

 

 

 

---

 

 

 

 

 

 

 

---

 

 

 

 

 

 

 

 

 

 

빨간박스는 위쪽, 왼쪽으로 각각 20px의 여백을 가진다.

마진은 대상을 이동시키고 원하는 만큼의 간격을 설정하는 훌륭한 방법이다.

유사한 방법으로 구성요소 내부에 여백을 설정할 때 '패딩'을 사용할 수 있다