3. 박스 모델
박스 모델은 모든 태그가 사각형 모양으로 구성됐다는 개념입니다. 박스 모델은 margin, border, padding, content 영역으로 구성되며 각 영역마다 영역을 제어하는 속성이 있습니다.
|
영역 |
속성 |
|
margin |
margin, margin-top, margin-right, margin-bottom, margin-left |
|
border |
border, border-top, border-right, border-bottom, border-left |
|
padding |
padding, padding-top, padding-right, padding-bottom, padding-left |
|
content |
width, height |
4. 배경 속성
요소의 배경을 제어하는 속성입니다.
|
속성 |
설명 |
|
background-color |
배경색을 지정합니다. |
|
background-image |
배경에 이미지를 삽입합니다. |
|
background-repeat |
배경 이미지의 반복 여부를 지정합니다. |
|
background-size |
배경 이미지의 크기를 지정합니다. |
|
background-position |
배경 이미지의 위치를 지정합니다. |
|
background-attachment |
배경 이미지를 스크롤할 때의 모습을 결정합니다. |
|
background |
모든 배경 속성을 한 번에 사용할 수 있는 단축 속성입니다. |