박스모델 > Web 끄적임

• 목록
• 게시판 리스트 옵션
  • 검색

박스모델

HTML의 엘리먼트들은 (사각형 모양을 의미하는)박스의 형태를 가지고 있는데 이것을 가르켜 박스모델이라고 하고, 박스의 크기와 박스간의 간격을 정의하는 다양한 속성이 있다.

margin : border를 기준으로 박스의 여백을 지정, 시각적인 요소는 없음

border : 박스의 테두리

padding : 테두리와 content간의 간격

content : 엘리먼트 안에 포함되는 컨텐츠

margin:10px - 상우하좌의 margin값이 10px

margin:10px 20px - 상하 10px, 좌우 20px,

margin:10px 20px 30px - 상 10px, 좌우 20px, 하 30px

margin:10px 20px 30px 40px - 상우하좌의 순으로 값이 지정됨