레이아웃 태그들

김수정·2020년 3월 15일
0

HTML 끝내기

목록 보기
5/10
post-custom-banner

웹사이트의 기본 구조를 이루는 태그들입니다.
의미적으로 사용되고 특별한 기능은 없습니다.

header

로고나 태그, 웹페이지가 바뀌어도 대체로 유지되는 부분입니다.
ex) <header>

navigation bar

웹사이트의 메인 영역들의 링크를 모아놓은 일명 '메뉴'들이 있는 곳입니다. 필수는 아니지만 보통 header안에 위치합니다.
ex) <nav>

main

그 페이지에서 보여주고자 하는 주 내용이 들어가는 영역입니다.
ex) <main>, subsections: <article>, <section>

sidebar

부가적인 정보를 담당하거나 두 번째 메뉴가 되거나 보조적으로 사용되는 영역입니다.
ex) <aside>

footer

하단의 작은 글씨, 저작권 고지 또는 연락처 정보 등을 담고 있습니다.
ex) <footer>

의미가 없는 레이아웃 태그

모든 콘텐츠가 이 의미안에서만 동작할 수 없으므로, 그 외의 요소들에는 블록레벨에는 div를, 인라인레벨에는 span으로 감싸서 표현하는 것이 좋습니다. 단, 너무 남발하여 의미가 전부 실종되지 않도록 주의하시는 게 좋습니다.
ex) <div>, <span>

나누기 태그

주제별로, 단락별로 임의로 나누는 의미를 가진 태그들이 있습니다.
<br>은 단락 안에서도 강제 줄바꿈을 해주고,
<hr>은 주제가 바뀔 때 표시를 해주는데 가로선으로 디자인 되어 나옵니다.

profile
정리하는 개발자
post-custom-banner

0개의 댓글