반응형
GitHub - junsu1220/TIL: Today I Learned.
Today I Learned. Contribute to junsu1220/TIL development by creating an account on GitHub.
github.com
- 웹페이지의 레이아웃을 구성하기 위해서 공간을 분할할 필요가 있다.
- 공간을 분할할 수 있는 태그는 div,span,table등이 있는데, 과거에는 table 태그를 사용하여 레이아웃을 구성하기도 하였으나 모던 웹에서는 주로div`를 사용하여 레이아웃을 구성한다.
- 그런데 div태그는 의미론적으로 어떠한 의미도 가지고 있지 않기 때문에 아래와 같이 HTML5에서 새롭게 추가된 시맨틱 태그를 사용하는 것이 더 나은 방법이나 IE에서 작동하지 않기 때문에 주의가 필요하다.
tagDescription
| header | 헤더를 의미한다 |
| nav | 내비게이션을 의미한다 |
| aside | 사이드에 위치하는 공간을 의미한다 |
| section | 본문의 여러 내용(article)을 포함하는 공간을 의미한다 |
| article | 분문의 주내용이 들어가는 공간을 의미한다 |
| footer | 푸터를 의미한다 |
- 이와 같은 공간 분할 태그는 일반적으로 다른 요소를 포함하는 컨테이너 역할을 하게 된다.
- div와 span의 차이는 block레벨 요소와 inline레벨 요소를 이해하여야 한다.
- 이에 대한 자세한 내용은 display 프로퍼티 https://poiemaweb.com/css3-display#1-display-%ED%94%84%EB%A1%9C%ED%8D%BC%ED%8B%B0 를 참조하기 바란다.
반응형
'프론트엔드 기초 > HTML' 카테고리의 다른 글
| 8.사용자와의 커뮤니케이션을 위한 폼 태그 (0) | 2022.01.08 |
|---|---|
| 7.이미지의 표현과 동영상, 음악 들 멀티미디어를 지원하는 태그 (0) | 2022.01.08 |
| 6.목록(List)와 표(Table)형식 표현을 위한 태그 (0) | 2022.01.08 |
| 5.HTML의 핵심 개념인 Hyperlink (0) | 2022.01.08 |
| 4.텍스트 관련 태그 (0) | 2022.01.07 |