margin 기본 사용법
1번- margin: 10px;
2번- margin: 10px 20px;
3번- margin: 10px 20px 30px;
4번- margin: 10px 20px 30px 40px;
1번 적용- margin: [위, 아래, 좌, 우];
2번 적용- margin: [위, 아래], [좌, 우];
3번 적용- margin: 위, [좌, 우], 아래;
4번 적용- margin: 위 우 아래 좌;
1번- margin: 10px;
2번- margin: 10px 20px;
3번- margin: 10px 20px 30px;
4번- margin: 10px 20px 30px 40px;
1번 적용- margin: [위, 아래, 좌, 우];
2번 적용- margin: [위, 아래], [좌, 우];
3번 적용- margin: 위, [좌, 우], 아래;
4번 적용- margin: 위 우 아래 좌;
margin 중복(중첩)
1번: 부모 요소의 margin-top과 자식 요소의 margin-top이 만났을 때
2번: 부모 요소의 margin-bottom과 자식 요소의 margin-bottom이 만났을 때
3번: 형제 요소들의 margin-top과 margin-bottom이 만났을 때
*주의: 형제 요소들의 margin-left와 margin-right가 만났을 때는 중첩이 허용되지 않는다!
'> HTML-CSS' 카테고리의 다른 글
[HTML/CSS] position의 속성 5가지 (static, relative, absolute, fixed, sticky) (0) | 2020.12.29 |
---|---|
[HTML/CSS] class, id 각각 언제 쓰는 것이 좋을까? (0) | 2020.11.05 |
[HTML] `<meta http-equiv="X-UA-Compatible" content="ie=edge">` (0) | 2020.11.04 |
[CSS] padding 기본 사용법 (0) | 2020.10.29 |
[HTML] Block 요소와 Inline 요소, 그리고 Inline-block 요소 (0) | 2020.10.25 |
댓글