[웹문서]nav태그, 내비게이션을 나타내기

 

반갑습니다. 잡지식스토리의 촉끼남입니다.

이번에는 <nav>...</nav> 태그에 대해서 정리해 보는 시간을 갖도록 하겠습니다.

 

nav 태그

---

일단 nav 태그는 영어로 navigation(내비게이션)의 의미를 가지고 있는 태그입니다.

여러분들도 다 알고 계시겠지만, 내비게이션은 길을 찾아주는 도우미 장비입니다.

웹문서에서 내비게이션은 같은 의미로 상통합니다.

사이트 내의 각 웹문서들을 찾기 쉽게 도와주는 태그로 해석할 수 있습니다.

음.. 제 나름대로 조금 더 쉽게 설명을 하자면, nav 태그는 해당 사이트의 메뉴 카테고리라고 정의할 수 있습니다.

---

 

그렇습니다.

어떤 사이트의 메뉴 카테고리를 nav 태그를 통해서 나타내는 것입니다.

그럼 예제를 통해서 조금더 살펴보겠습니다.

 

일단 HTML 소스 작성 문서입니다.

body 태그 안에서 사용되었음을 알 수 있습니다.

또, <ul>..</ul> 태그와 <li>...</li> 태그를 사용하여 목록으로 만들었음을 알 수 있습니다.

 

 

 

다음음 웹브라우저 IE10으로 웹문서를 실행시킨 화면입니다.

브라우저 내용 상단에 제목이 있는 것을 확일할 수 있고, 그 아래로 목록이 보입니다.

각 항목을 클릭하면 해당 웹페이지로 이동합니다.

 

 

일단 기본적으로 nav태그는 웹문서의 전체 구성 중에서 설정에 따라서 좌우측에 표시되는 것이 기본입니다.

네이버 블로그나 티스토리 블로그에서 카테고리가 보통 어디에 있는지 생각해 보시면 이해하기 쉬울 것입니다.

그리고, 웹문서 하단에서도 각 카테고리로 이동할 수 있게 되어 있는 사이트들이 있습니다.

웹문서 하단 내비게이션 태그는 nav태그가 아니고 footer 태그를 이용한다는 것을 알고 계시기 바랍니다.

 

어렵게 설명을 하였지만, 실제로 해보면 아무것도 아니니까, 한번씩 실습을 해 보시기 바랍니다.

이번 포스팅은 여기까지입니다.

지금까지 잡지식스토리의 촉끼남이였으며, 앞으로도 계속 유용한 웹문서 공부거리로 포스팅을 진행하겠습니다.

휘리릭~~!!