* [생활코딩] CSS 목차
두 번째 목표인 레이아웃 제작입니다.
박스모델을 이용하면 1차 작업을 끝낼 수 있습니다.
1. 박스 모델 (Box model)
- HTML 태그 하나하나를 박스로 취급
- 부피감 결정
1. 콘텐츠 (Contents)
1) width: 콘텐츠 폭
2) height: 콘텐츠 높이
2. 패딩 (padding)
- 콘텐츠 바깥쪽에 있는 테두리 사이 간격
3. 마진 (margin)
- 테두리와 테두리 사이
2. 실습
1. 결과
- 회색 선 그리기
1) 가로선: h1 태그
2) 세로선: ol 태그
2. 코드
'프론트엔드 > 생활코딩' 카테고리의 다른 글
[생활코딩] CSS 9. 미디어 쿼리 (MediaQuery) (0) | 2023.11.05 |
---|---|
[생활코딩] CSS 7. 그리드 (레이아웃 제작) (0) | 2023.11.05 |
[생활코딩] CSS 4. HTML 태그의 크기 (0) | 2023.11.05 |
[생활코딩] CSS 3. 선택자와 속성 (0) | 2023.11.05 |
[생활코딩] CSS 2. Style 태그와 속성 (0) | 2023.11.05 |