[HTML 기초 강좌] 7. 링크연결

2016. 1. 18. 13:58language/html

1. 링크 연결

링크 연결이란 그림이나 글자와 다른 문서를 서로 연결하는 작업을 말한다.

클릭시 다른 사이트로 이동(네이버로 이동하거나 구글로 이동)하는 것도 링크 연결이 될 수 있으며 메일을 보낼 수도 있고 책갈피 처럼 클릭 시 원하는 위치로 스크롤링 되어지는 것도 링크 연결이라 할 수 있다.

 

링크 연결은 a 태그를 사용한다.

a 태그는 href 속성을 사용하여 설정된 주소로 링크연결 또는 위치 이동을 가능하게 해준다.

 

1.1 같은 문서 내의 링크

웹페이지에 현재 보고있는 html 강좌들이 하나의 페이지에 모두 나온다고 가정해보자.

인덱스 (목차) 가 없으면 보고 싶은 위치로 이동하려면 스크롤을 내려가며 직접 확인해야한다.

하지만 같은 문서 내에 링크를 걸어두면 원하는 위치로 바로바로 이동할 수 있다.

이해가 되지 않는다면 직접 해봐야 이해가 될것이다.

 

* 설정하는 방법

1) <a name="이름"></a> 을 이용하여 이동할 위치에 책갈피 설정을 한다.
2) <a href="#이름">글자나 그림</a> 를 이용하여 책갈피로 설정된 위치로 이동 할 수 있도록 링크를 설정한다.

 

ex) 같은문서내의링크.html

 

br 태그를 계속 입력한 이유는 줄바꿈을 많이 생성해서 스크롤을 강제로 만들기 위함이다.

직접 실습해보면 어떻게 이동되는지 쉽게 알 수 있다.

 

 

 

1.2 링크 연결

그림이나 글자와 다른 문서를 서로 연결하는 작업을 말한다.

내 홈페이지에서 다른 홈페이지로 이동 할 수도 있고 내 홈페이지 내에 다른 페이지로 이동할 수도 있다.

관리자에게 메일도 보낼 수 있고 네이버나 구글로 이동 시켜 줄 수도 있다.

 

* 설정하는 방법

그림이나 글자와 다른 문서를 서로 연결하는 작업을 말한다.
형식) <a href="문서명 또는 url주소">그림이나 글자</a>
        <a href="mailto:이메일주소">그림이나 글자</a>

 

 

ex) 링크연결.html

 

결과는 직접 실습해 보길 바란다.