a 태그 속성

이 a 요소는 바로 페이지를 이동하는 링크 역할을 합니다. HTML의 약자의 'Hyper Text'가 바로 a 요소라 할 수 있고, 그만큼 웹에서 빠질 수 없는 요소입니다. a 요소는 다음과 같이 적습니다.

<a href="http://webberstudy.com">웨버스터디 홈으로 가기</a>

 

a 요소에서 href 속성에 원하는 주소를 적어주면 a 요소가 감싸는 텍스트를 클릭 시에 해당 주소로 이동합니다. 여기서 'href' 속성은 'Hyper Reference'를 줄여 만든 것입니다. '다른 차원에 대한 참조' 정도로 이해하시면 될 거 같고요. 아까 img 요소의 'src' 속성은 'Source'의 줄임 말 입니다. 말 그대로 소스로 이해하시면 됩니다. 종종 이 두 가지 속성을 헷갈릴 때가 있는데, 잘 기억하시기 바랍니다.

 

 

a:link= 링크가 걸려있는 부분의 기본속성

a:visited =해당 링크를 방문한 적이 있을 때

a:active = 링크를 클릭하고 있을 때

a:hover =마우스 오버 했을때

 

HTML A tag: name=" " 같은 페이지(문서) 또는 다른 페이지의 특정 위치로 이동하기

 

블로그나 웹페이의 특정한 위치로 이동하는 링크를 넣는 방법은, 이동하고자 하는 위치에 이름을 붙여 지정하는 일과 그 지정한 이름이 있는 위치로 가는 링크를 거는 일 두 가지로 나누어 생각할 수 있다.

1) 위치 지정하기
HTML 편집창에서, 아래와 같이 이름(name)을 붙인 <a>태그를 원하는 위치에 넣어 주면 된다.
 "~~"부분은 이동할 목표지점에 붙인 임의의 이름이며, 숫자와 알파벳으로 적어 주면 된다. 여기서는 장미꽃 그림으로 가도록 하려고 이름을 쉽게 "jangmi"라고 붙였다.

<a name="jangmi">

2) 지정한 위치로 가는 링커 걸기
지정한 위치로 가는 링크는 두 가지를 생각할 수 있다. 하나는 링크와 같은 페이지 안의 특정한 위치로 가는 것이고, 둘은 다른 페이지 또는 다른 사이트의 특정한 페이지의 특정한 위치로 가는 것이다.

(1) 같은 페이지 안에서 이동할 때
같은 페이지 안의 특정한 위치로 가고자 할 때는 아래와 같이 <a> 태그의 이동할 위치 참조(href)에 #과 위치를 지정한 이름을 붙여 쓰면 된다.
아래는 같은 페이지 안에서 이름(name)이 jangmi로 붙여진 위치로 이동하는 태그 모양이다.

<a href="#jangmi">장미 구경하세요</a>

(2) 다른 페이지 또는 다른 사이트의 특정 페이지의 특정 위치로 이동할 때
위의 같은 페이지 안에서 이동할 때와 다른 점은 사이트나 페이지의 주소(URL)를 함께 적어 주는 것 뿐이다.

<a href="이동할 페이지의 주소(URL)#jangmi">장미 구경하세요</a>

HTML A tag: name=" " 같은 페이지(문서) 또는 다른 페이지의 특정 위치로 이동하기 (wayful.com)

참고하기!!

HTML A tag: name=" " 같은 페이지(문서) 또는 다른 페이지의 특정 위치로 이동하기