margin: 10px 2px 5px; : 이건 뭔 의미야?
`margin: 10px 2px 5px;`은 CSS의 `margin` 속성을 사용하여 요소의 여백을 설정하는데, 시계방향 순서로 각 방향의 여백을 설정하는 것을 의미합니다.
각 숫자는 순서대로 위쪽(`top`), 오른쪽(`right`), 아래쪽(`bottom`), 왼쪽(`left`) 방향의 여백 값을 나타냅니다.
- 위쪽(`top`) 여백: 10px
- 오른쪽(`right`) 여백: 2px
- 아래쪽(`bottom`) 여백: 5px
- 왼쪽(`left`) 여백: 2px
따라서 위의 설정은 해당 요소의 위쪽 여백을 10px, 오른쪽과 왼쪽 여백을 2px, 아래쪽 여백을 5px로 설정하는 것을 의미합니다. 이렇게 네 방향의 값을 설정함으로써 다양한 여백 조합을 쉽게 만들 수 있습니다. 만약 두 방향만 설정하고 싶다면 `margin: 10px 2px;`와 같이 작성할 수 있습니다.
'frontend > CSS' 카테고리의 다른 글
| [강의정보] CSS 기초 -드림코딩, CSS 레이아웃 - 유노코딩 (0) | 2023.07.25 |
|---|---|
| flexbox wrap & grow (feat. shrink) (0) | 2023.07.25 |
| 한 부모 안에 있는 여러 아이템들의 공간 차지 비율을 조정 (0) | 2023.07.25 |
| flexbox, flex-grow (0) | 2023.07.25 |
| Flexbox : CSS Grid (0) | 2023.07.25 |
| padding과 margin의 차이 (0) | 2023.07.25 |
| 사라지고 나타나고~ : 미디어쿼리 (0) | 2023.07.24 |
| 세로 블록들을 가로로 배치하는 방법 (0) | 2023.07.23 |