[CSS] 박스 모델 (크기, 테두리, 마진, 패딩)


[CSS] 박스 모델 (크기, 테두리, 마진, 패딩)

박스 모델 - 실제 콘텐츠 영역, 패딩, 테두리, 마진 등의 요소로 구성됨 - 확인 : [F12] - [개발자 도구] 박스 모델 너비 기준 설정 선택자 { box-sizing : content-box | border-box ; } - content-box (기본값) : width 속성 값을 콘텐츠 영역 너비 값으로 사용함 - border-box : width 속성 값을 (콘텐츠 영역 + 패딩 + 테두리)의 너비 값으로 사용함 너비 (width) & 높이 (height) 선택자 { width : 너비px | 백분율 | auto ; height : 높이px | 백분율 | auto ; } - min-width : 100% → 너비를 화면에 꽉 차게 함 - min-height : 100% → 높이를 화면에 꽉 ..


원문링크 : [CSS] 박스 모델 (크기, 테두리, 마진, 패딩)