▣ 링크를 시키자
이번 시간에는 링크에 대하여 알아보겠습니다.
(1) <a> 태그
하이퍼 링크 또는 줄여서 링크라고 합니다.
기본 상태는 인터넷 상에서 파란색 글씨 아래에 밑줄이 그어져 있고
그 곳 위에 마우스 커서를 가져가면 커서 모양이 손모양으로 변경되며
그 곳을 클릭하면 연결된 곳(위치, 화면 등)으로 이동하는 것입니다.
태그는 앵커(Anchor)의 첫 머리글자인 A로 <a>와 같이 쓰는데
<a>태그와 같이 사용되는 요소로는 href, name, target이 있습니다.
- 특정주소의 문서나 웹페이지로 이동시키는 href
- 동일한 디렉토리의 다른 문서의 특정부분으로 이동시키는 name
- 클릭 했을때 연결된 부분이 나타나는 방법을 정하는 것이 target이다
o 형식은 <a href ="인터넷 주소“> 화면에 나타낼 문자 </a>
위와 같은 형식으로 만들어 인터넷 주소가 있는 사이트로 이동하는데
링크로 연결시킬 수 있는 것은 문자, 음악, 이미지, 버튼 등이 있다.
다음 검색 사이트로 가는 링크를 만들어 보면
<a href="http://www.daum.net"> 다음 사이트 </a>
이렇게 했을 경우 화면상에는 다음 사이트라는 글자가 파란색으로
아래 밑줄이 그어진 상태로 보인다. 다음 사이트 글자 위로 마우스
커서를 가져가면 손 모양으로 변하는데 이때 그 곳을 클릭하면
다음 사이트로 이동한다.
이미지에 링크를 시키려면
<a href="연결할 인터넷 주소"> <img src=이미지 주소> </a>
음악도 음악이 있는 사이트주소를 넣으면 됩니다.
음악을 링크시키는 개념으로 생각해 브라우져가 음악을 링크한뒤
거기에 맞는 플레이어로 재생을 하는겁니다.
<embed>와 다른점은, 이 태그는 재생기가 브라우져에 포함되어
나온다는 것이고 링크는 자료 자체를 링크시키기 때문에 여러분
컴퓨터에서 설정된 플레이어로 재생이 된다는 점이 다릅니다.
그리고 만약 특정 파일을 링크 시키는데 여러분 컴퓨터에서 지정된
플레이어가 없을시 일반 자료로 간주해 다운로드로 넘어가게 됩니다
즉, 링크 태그는 링크시에 브라우져가 영상화, 음성화 할수 있는 것은
최대한 그렇게 해주고 아닌것은 자료식으로 다운로드가 된다는 겁니다.
음악 링크 예시
<a href=http://ju888g.linkfile.net/www1/ju41.wma>설운도 / 누이 </a>
위와 같이 태그를 작성하면 화면에는 "설운도 / 누이" 글자만 표시되고
그 글자를 클릭하면 음악창이 뜨면서 노래가 나오게됩니다.
아래와 같이 작성하면 음악플레이어가 나타나어 비교가 되지요
<embed src=http://ju888g.linkfile.net/www1/ju41.wma>
(2) 다음은 target(타겟)에 대하여 알아보자
위의 예에서 보듯이 <a href="http://www.daum.net"> 다음 사이트 </a>
지정하고 target(타겟)을 별도로 지정하지 않으면 현재 보고 있는 창
위에 이동된 문서가 나타난다.
현재 열려있는 창 위에 다른 창으로 이동하게 될 창이 나타나게 하려면
target=_top 또는 target=_blank 이렇게 써 줘야 한다
_blank, _top는 현재 창위에 새로운 창을 하나띄워서 보여주고.
_self는 현재 사용하고 있는 그 창에 바로 보여주는 것 입니다.
아래 두가지 방법으로 표현하여 어떤 차이가 있는지 비교해 보세요
<a href="http://www.daum.net" target=_blank> 다음 사이트 </a>
<a href="http://www.daum.net" > 다음 사이트 </a>
다음은 저의 블로그인 로댕하우스로 링크를 걸어보는 연습을 해보죠
블로그 주소는 http://blog.daum.net/yse57 입니다.
<a href=" http://blog.daum.net/yse57" target=_blank>
로댕 하우스(블로그) </a>
위와 같이 링크관련 태그를 써서(소스 작성) 웹문서로 만들면
바탕화면에 "로댕하우스(블로그)" 라는 글자만 표시되는데
이 글자를 클릭하면 새로운 창에 저의 블로그 창이 열립니다.