HTML.CSS.JavaScript/수업

10. 하이퍼 링크(4-1)

멜데스 2017. 5. 12. 00:58

하이퍼링크 

– 연결된 개체를 의미 

• 링크된 글자나 이미지 등을 클릭하면 다른 문서로 이동 

• 여러 개의 문서를 고리처럼 연결 

– 문서간의 연결을 위해 <a> 태그 사용 

• “href” 속성은 이동하고자 하는 곳의 위치 지정 

• <a>~</a> 사이에는 웹 브라우저에 보여질 텍스트 지정 

• 웹 브라우저에 보여지는 텍스트는 파란 색상을 띠며 밑줄이 그려짐 

• <a href="링크할 곳의 파일명">웹 브라우저에 보여질 텍스트</a> 

– 링크색 지정 

• <body>태그 내에 지정 

• link=“색상”, vlink=“색상”, alink=“색상” 

– link : 연결 기능 있는 상태에서 선택하지 않은 상태의 링크 색상 

– vlink : 한번이라도 방문했던 적이 있는 상태의 링크 색상 

– aink : 마우스로 누르고 있는 상태에서의 링크 색상 


2. 이미지, 다른 홈페이지를 링크로 이용하기 

• 현재 페이지에서 다른 페이지 또는 홈페이지 연결 

– HTML 문서간의 이동하는 것을 응용 

– “href” 속성에 링크할 곳의 파일명 대신 사이트 주소 지정 

• <a href=http://www.naver.com> 네이버 </a> 

• <a href=http://www.nate.com> 네이트 </a> 


(1) HTML 문서 - 가장 보편적인 하이퍼링크입니다. 

(2) 다른 홈페이지 - 다른 홈페이지의 URL을 입력하면 하이퍼링크를 이용하여 이동이 가능합니다. 

(3) 텍스트 - 하이퍼링크를 사용하면 같은 페이지 내에 다른 텍스트로 이동하

는 것이 가능합니다. 이를 앵커라 하며 문서가 너무 길 경우 책갈피 역할을 합니다.  

(4) 이미지, 사운드, 동영상 클립 – “href” 속성의 값으로 이미지나 사운드, 그

리고 동영상 파일의 명칭을 입력하면 브라우저가 연결된 프로그램을 이용

하여 이를 재생하게 됩니다.  

(5) 파일 - 파일의 명칭을 연결하면 다운로드 받게끔 할 수 있습니다. 

(6) email - e-mail 주소를 입력하여 자신에게 e-mail을 보낼 수 있는 링크를 만들 수 있습니다. 

(7) 기타링크 - 파일전송 프로토콜(ftp)이나 유즈넷(usenet)에 있는 파일이나 문서를 연결할 수 있습니다.