이제까지 링크 태그가 무엇인지, 어떻게 구성되어 있는지 살펴보았습니다. 사용법에 대해 감을 잡으셨겠지만, 앞서 본 구성은 한글로 작성되어 있기 때문에 실제 코드로는 사용할 수 없습니다. 이번 강의에서는 <a>
태그의 속성에 어떤 구문을 사용해야 하는지 알아보고, 실제 실습까지 진행하겠습니다.
<a>의 속성, href
<a>
태그는 태그, 컨텐츠 이외에 href
라는 속성을 함께 사용해야 올바르게 동작합니다. href는 Hypertext Reference의 약자로, <a>
가 참조하는 웹 사이트 주소(경로)를 값으로 가집니다. 간단한 예시를 들면, "<a>
는 https://ide.goorm.io
라는 사이트를 연결하고 있다"는 정보를 담습니다.
그러면 href
는 어디에 입력해야 할까요? 앞서 링크 태그의 구성에서 속성은 링크 태그의 이름 바로 뒤에 한 칸 공백을 가진 뒤 작성한다고 설명했습니다. 즉, <a>
태그에서는 a
다음에 공백을 입력한 뒤 href
와 웹 페이지 주소 및 경로를 입력합니다. 여기서 웹 페이지 주소 및 경로는 href
의 값입니다.
<a>의 속성, target
target
속성은 링크를 클릭했을 때 해당 페이지를 어디에서 열지 정하는 속성입니다. 링크를 열 때 오른쪽 마우스 버튼으로 클릭하면 새 창에서 링크 열기
와 새 탭에서 링크 열기
등 다양한 선택지를 발견할 수 있습니다. 이처럼 링크를 여는 장소는 새 탭 혹은 새 창이 될 수 있고, 보던 탭 혹은 보던 창이 될 수 있습니다.
target
속성에서 사용할 수 있는 대표 값은 _self
와 _blank
입니다. _self
는 현재 탭에서 링크를 열고, _blank
는 새 탭 혹은 새 창(옛 버젼 브라우저의 경우)에서 링크를 엽니다. 태그 안에 속성으로 입력할 때 다음과 같이 작성합니다.
target="_self"
target="_blank"