Rainbow
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"라고 붙였다.
2) 지정한 위치로 가는 링커 걸기
지정한 위치로 가는 링크는 두 가지를 생각할 수 있다. 하나는 링크와 같은 페이지 안의 특정한 위치로 가는 것이고, 둘은 다른 페이지 또는 다른 사이트의 특정한 페이지의 특정한 위치로 가는 것이다.
(1) 같은 페이지 안에서 이동할 때
같은 페이지 안의 특정한 위치로 가고자 할 때는 아래와 같이 <a> 태그의 이동할 위치 참조(href)에 #과 위치를 지정한 이름을 붙여 쓰면 된다.
아래는 같은 페이지 안에서 이름(name)이 jangmi로 붙여진 위치로 이동하는 태그 모양이다.
(2) 다른 페이지 또는 다른 사이트의 특정 페이지의 특정 위치로 이동할 때
위의 같은 페이지 안에서 이동할 때와 다른 점은 사이트나 페이지의 주소(URL)를 함께 적어 주는 것 뿐이다.
HTML A tag: name=" " 같은 페이지(문서) 또는 다른 페이지의 특정 위치로 이동하기 (wayful.com)
참고하기!!
'web > html' 카테고리의 다른 글
[html/css] html 기초 (0) | 2022.03.08 |
---|---|
웹 표준 & 웹 접근성에 대하여 (0) | 2021.12.16 |
id와ㅣspan 요소 (0) | 2021.07.08 |
form태그 enctype속성 (0) | 2021.06.24 |
이미지 포멧 (0) | 2021.06.17 |