[CSS] margin과 padding의 차이

Margin: Object와 화면과의 여백(외부여백)
Padding: Object내의 내부여백

1. 속성 4개 사용

• 시계방향(위, 오른쪽, 아래, 왼쪽) 순서로 값을 주면 된다.

Ex)

margin : 10px 10px 10px 10px

2. 속성 2개 사용

• 2개의 속성만 사용할 경우, 첫번째 값은 위와 아래 / 두번째 값은 오른쪽과 왼쪽 여백을 의미한다.

Ex)

margin : 10px 10px

3. 속성 1개 사용

• 1개의 속성만 사용할 경우, 위, 오른쪽, 아래, 왼쪽 모두 같은 값을 사용하게 된다.

Ex)

margin : 10px

4. 가운데 정렬

• auto를 이용한다. padding은 auto값 선언 불가.

Ex)

margin : auto