[Day 13] CSS 박스 모델

1. 블록 레벨 요소&인라인 레벨 요소 ① 블록 레벨(block-level) 요소?

: 태그를 사용해 요소를 삽입했을 때 혼자 한 줄을 차지하는 것 ② 인라인 레벨(inline-level) 요소? : 한 줄을 차지하지 않고, 콘텐츠만큼만 영역을 차지하는 것 2.

박스 모델 웹 문서의 블록 레벨 요소는 모두 박스형태 → 박스 모델 요소 : 콘텐츠 영역, 패딩(padding), 테두리(border), 마진(margin) 등의 요소로 구성 박스 모델 요소 3. 관련 CSS 1) width, height : 콘텐츠 영역의 크기 지정 속성값 - auto : 콘텐츠 양에 따라 width, height 자동 결정.

기본값. - <크기> : px이나 em 단위로 지정 - <백분율> : 박스 모델을 포함하는 부모 요소를 기준으로 백분율(%)으로 width, height 지정. 사용 예) .box { width: 20px; height: 100px; } 2) box-sizing : 박스 모델의 크기를...