컴퓨터 관련/태그

태그 하이퍼링크 걸기

승명 2017. 1. 14. 19:47
1. 하이퍼 링크 형식


○ 하이퍼링크란?

하이퍼링크는 인터넷으로 검색하다보면 글자나 이미지(그림)에 마우스를 올리면 손가락이 나타나는데 이것은 모두 링크되어 있는 것으로 클릭하면 다른 웹사이트로 연결되는 것이 하이퍼링크로 인터넷에서 다른 웹페이지로 연결하는 기본이 되는 속성입니다.  

 

 

○ 하이퍼링크 기본 형식

 

하이퍼링크 기본 형식 : <A href="연결하고자하는 문서나 웹페이지 URL>텍스트</A>


○ 하이퍼링크 속성

 

 속성

설명 

 _blank

 웹브라우저의 창을 새로 열어 연결된 내용을 보여줍니다.

 _self

 현재 보고 있는 창에서 링크된 내용을 보여줍니다. 타로 속성을 지정하지 않으면 _self가 기본값으로 됩니다.

 _parent

 현재의 창보다 상위의 프레임 창이 열립니다.

 _top

 웹브라우저의 창이 전체 창으로 열립니다.

 


2. 네이버 블로그와 티스토리에서의 하이퍼링크


○ 네이버 블로그에서의 하이퍼링크

네이버 블로그에서 포스트 쓰기로 들어가서 여우비 블로그로 입력한 다음 글자를 블럭지정하여 URL 아이콘을 클릭하고 링크할 주소(URL)을 입력한 다음 적용하면 여우비 블로그에 하이퍼링크가 적용됩니다.

 

포스트 쓰기에서 HTML로 들어가면 아래와 같이 하이퍼링크가 적용된 것을 볼 수 있습니다.

 

<A href="http://blog.naver.com/shakiramania" target=_self>여우비 블로그</A>



 





○ 티스토리에서의 하이퍼링크

티스토리에서도 네이버 블로그와 같이 글쓰기로 들어가서 여우비 블로그로 입력한 다음 글자를 블럭지정하여 URL 아이콘을 클릭하고 링크할 주소(URL)을 입력한 다음 적용하면 여우비 블로그에 하이퍼링크가 적용됩니다.

 

글쓰기에서 HTML로 들어가면 아래와 같이 하이퍼링크가 적용된 것을 볼 수 있습니다.

 

<A class=tx-link href="http://homenetwork.tistory.com" target=_blank>여우비 블로그</A>


 




3. 하이퍼링크 예제


HTML 태그를 사용하여 하이퍼링크를 사용하는 예제는 아래와 같습니다.

 

예제 다운받기

 

1. 하이퍼링크 태그 텍스트 파일 ---> 하이퍼링크 태그.txt

2. 하이퍼링크 HTML 파일 --->  하이퍼링크 태그.html

 

<html>

<head>

<title>하이퍼링크를 사용하는 예제</title>

</head>

<body>

<P>여우비 블로그</P>

<P>

<A href="http://blog.naver.com/shakiramania" target=_self>네이버 여우비 블로그</A>
<br><br>
<A href="http://homenetwork.tistory.com" target=_blank>티스토리 여우비 블로그</A>

</P>

</body>

</html>




4. 문자(텍스트) 하이퍼링크

블로그에 글을 올리면서 링크를 걸어서 다른 페이지로 이동하는 방법에 대해 알아보았습니다.

블로그 글쓰기 화면에서 URL 아이콘을 이용하여 쉽게 하이퍼링크를 걸수 있도록 되어 있어 쉽게 적용할 수있습니다. 글쓰기 화면에서 HTML 화면에서 링크가 HTML 태그로 어떻게 적용되는지 한번 보시면 쉽게 이해할 수 있을 것입니다. 다음에는 이미지(그림)에 하이퍼링크를 거는 방법에 대해 알아보도록 하겠습니다.

 

HTML 태그를 처음 접하시면 분들을 위해 쉽게 적는다고 했는데....쉬웠는지 모르겠습니다.

끝까지 읽어주셔서 감사합니다.

행복한 하루 되세요.