포트폴리오에서 네비게이션 메뉴를 구현하려고 하는데요..!

인프런 커뮤니티 질문&답변

작성한 질문수

HTML+CSS+JS 포트폴리오 실전 퍼블리싱(시즌1)

탭 메뉴 콘텐츠- 스타일 02(실전 제작) with jQuery

작성

316

선생님 안녕하세요!
다름이 아니라 포트폴리오에서

네비 부분에서 메뉴에서 메뉴로 이동시(home, about, work,,)에 이번 수업에서 배운 텝메뉴를 응용해서 하려고 이런식으로 마크업을 하다가

<ul>
  <li>home</li>
  <li>work</li>
  <li>contact</li>
</ul>

문득 생각해보니 생활코딩에서 페이지간 이동을 할 때 이런식으로 a태그로 마크업 하고 또 다른 html 파일을 만들어서 이동 했었던게 생각이 나서

<ul>
  <li><a href="home.html">home</a></li>
  <li><a href="work.html">work</a></li> 
  <li><a>home</a></li>
</ul>

메뉴와 메뉴 사이에 이동을 할때는 어떻게 해야하는지 약간 혼란이 오네요.. 어떻게 하면 좋을지 여쭤보고 싶습니다..

답변주시면 감사하겠습니다..!

답변 1

지식공유자

<ul>
  <li><a href="home.html">home</a></li>
  <li><a href="work.html">work</a></li> 
  <li><a>home</a></li>
</ul>

위의 방식은 페이지 내에서 이동이 아니라 외부 페이지로 이동됩니다.

페이지 내부에서 이동하는 방법은 제가 알고 있는 바로는...

a태그 href="#이름1"

페이지 내부에 특정 요소에 id="이름1"

이렇게 매칭을 시켜주셔야 합니다.

다른 페이지의 특정부분으로 바로가게 만들 경우는

a태그 href="work.html#이름1"

work.html 페이지 내부에 특정 요소에 id="이름1"

이렇게 매칭시켜주시면 work.html로 이동하면서 해당 페이지 내에 특정 부분으로 이동합니다.

탭 메뉴 만들기 예제인데 질문하신 내용에 맞는 답변인지는 모르겠네요.

혹시 다른 질문이었다면 좀 더 구체적으로 다시 질문 주세요.

작성한 질문수