html coding 중  box-size에 대한 정리

html 코딩중에 개체 (오브젝트)  등을  구성하는 box 들에 대한  넓이(widht) 와 높이(height) 에 대한 부분과 box의 padding(box의 안쪽 공간) margin(box의 밖같 공간)의 크기를 의미하며, padding 과 margin 의 사이에는 테두리(bording)가 존재 합니다.  각 속성은 크기(size)를 정의하여 사용하며, 수치를 정의하기 때문에 해당 부분에 px, rem등의 단위를 적용 할 수 있습니다.

margin 과 padding의 속성

  • padding :  본문 내용과  border 안쪽의 공간(여백)을 뜻함.
  • border: 선(선의 굵기를 조정할 수 있으며, 비쥬얼상 선을 표시 않고 숨길수도 있는 있지만, 삭제할 수는 없다.
  • margin: border의 바깥 공간(여백)을 뜻함.

box (오브젝트)의 배경색을 변경시에 box의 padding 은 배경색상에 영향을 받지만 바깥 공간(여백) 부분에 해당하는 margin는 배경색상에 영향을 받지 않는다. margin, padding  모두  ex) margin-top, margin-rignt, margin-bottom, margin-left 의 형태로 각 영역의 크기를 방향별로 설정할 수 있다.

STAY IN THE LOOP

Subscribe to our free newsletter.

[fusion_form form_post_id="4569" margin_bottom="0" hide_on_mobile="small-visibility,medium-visibility,large-visibility" /]

Related Posts

View all
  • Continue reading
  • Continue reading
  • Continue reading
  • Continue reading