<a></a> 링크 연결 페이지

| HTML/xhtml문법
2014. 1. 20. 23:59
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <!-- 현재 작성하고 있는 파일은 UTF-8 DOS파일입니다.-->
  3. <html xmlns="http://www.w3.org/1999/xhtml" lang="ko">
  4.   <head>
  5.     <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  6.   </head>
  7.   <body>
  8.     &lt;a&gt; 사용법<br />
  9.     &lt;a&gt; 사용 용도는 한 페이지에서 다른 페이지로 <br />
  10.     연결하는 데 사용되는 하이퍼 링크를 정의합니다. <br />
  11.     &lt;a&gt; 요소의 가장 중요한 특성은 링크의 목적지를 나타내는 href 속성입니다. <br /><br />
  12.     기본적으로 다음과 같이 링크가 모든 브라우저에 나타납니다. <br />
  13.     방문하지 않은 링크는 밑줄과 파란색<br />
  14.     방문한 링크는 밑줄과 보라색 <br />
  15.     활성 링크에 밑줄과 붉은한다<br /><br />
  16.     ( 속성-href, target, hreflang, rel, charset,  <br />
  17.     &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  18.     coords, name, rev, shape, download, media, type )<br />
  19.     <hr />
  20.     <b>&lt;a&gt; : 1.속성-href : 링크로 이동 페이지의 URL을 지정합니다.(필수)</b><br /><br />
  21.     <div id="ex_view2">
  22.       <!-- 1.해당 URL로 이동합니다. -->
  23.       <a href="http://roydest.tistory.com/"> 링크 roydest 블로그 이동 </a><br />
  24.       <!-- 2.책갈피 도착하는 곳입니다.(아래 책갈피 클릭하시면 알게 되십니다.) -->
  25.       <a id="top">책갈피 이곳으로 오기</a><br />
  26.       <!-- 3.javascript를 실행시킬수 있습니다. -->
  27.       <a href="javascript:alert('링크 눌렀어요');"> 알림창 열림 </a>
  28.     </div>
  29.     
  30.     <hr />
  31.     <b>&lt;a&gt; : 2.속성-target : 링크 된 문서를 여는 방법를 지정합니다.</b><br /><br />
  32.     <div id="ex_view2">
  33.     <!-- 1.동일한 프레임에서 링크 된 문서를 엽니다(기본값). -->
  34.       <a href="http://roydest.tistory.com/" target="_self"> _self방식 링크 roydest 이동 </a><br />
  35.     <!-- 2.새창 또는 새탭에서 링크 된 문서를 엽니다. -->
  36.       <a href="http://roydest.tistory.com/" target="_blank"> _blank 링크 roydest 이동 </a><br />
  37.     <!-- 3.부모 프레임에서 링크 된 문서를 엽니다. -->
  38.       <a href="http://roydest.tistory.com/" target="_parent"> _parent 링크 roydest 이동 </a><br />
  39.     <!-- 4.윈도우의 최상위에서 링크 된 문서를 엽니다. -->
  40.       <a href="http://roydest.tistory.com/" target="_top"> _top 링크 roydest 이동 </a><br />
  41.     <!-- 5.framename 프레임에서 링크 된 문서를 엽니다. -->
  42.       <a href="http://roydest.tistory.com/" target="framename"> framename 링크 이동 </a><br />
  43.     </div>
  44.     
  45.     <hr />
  46.     <b>&lt;a&gt; : 3.속성-hreflang : 링크 된 문서의 언어를 지정합니다. </b><br /><br />
  47.     <div id="ex_view2">
  48.       <a href="http://roydest.tistory.com/entry/Transitional과-HTML5-버전별-태그-지원-표" hreflang="ko" target="_blank"> 한글 언어링크 이동 </a><br />
  49.     </div>
  50.     
  51.     <hr />
  52.     <b>&lt;a&gt; : 4.속성-rel : 현재 문서와 링크 된 문서 사이의 관계를 지정한다.</b><br /><br />
  53.     <div id="ex_view2">
  54.       alternate,author,bookmark,help,license,next,nofollow,<br />
  55.       noreferrer,prefetch,prev,search,tag<br />
  56.       이렇게 속성값이 있는데 필요한 기능인지는 모르겠습니다.<br />
  57.     </div>
  58.     
  59.     <hr />
  60.     <b>&lt;a&gt; : 5.속성-charset : 링크 된 문서의 charset를 지정합니다. </b><br /><br />
  61.     <div id="ex_view2">
  62.     HTML5에서 지원되지 않습니다.<br />
  63.       링크 된 문서의 문자 집합을 지정합니다.<br />
  64.       라고 되어 있는데 브라우저에서 지원을 안해주는 기능입니다.<br />
  65.     </div>
  66.     
  67.     <hr />
  68.     <b>&lt;a&gt; : 6.속성-coords : 링크의 좌표를 지정합니다. </b><br /><br />
  69.     <div id="ex_view2">
  70.     HTML5에서 지원되지 않습니다.<br />
  71.       파이어 폭스와 오페라에서만 지원됩니다.<br />
  72.       모든 브라우저에서 작동 이미지지도를 만들 &lt;AREA&gt; 요소를 사용하면 됩니다.<br />
  73.       &lt;AREA&gt; 요소는 &lt;img&gt; 태그에서 설명하겠습니다.<br />
  74.     </div>
  75.     
  76.     <hr />
  77.     <b>&lt;a&gt; : 7.속성-name : 문서 내에서 책갈피를 만드는 데 사용됩니다. </b><br /><br />
  78.     <div id="ex_view2">
  79.       HTML5에서 지원되지 않습니다. <br />
  80.       대신 id 속성을 사용합니다. <br />
  81.       &lt;a id="top" 26라인 참고하세요.<br />
  82.       <!-- 2.책갈피로 이동합니다.(1.속성-href :) -->
  83.       <a href="#top">책갈피 위로 이동</a><br />
  84.     </div>
  85.     
  86.     <hr />
  87.     <b>&lt;a&gt; : 8.속성-rev : 링크 된 문서와 현재 문서 사이의 관계를 지정합니다.(text)</b><br /><br />
  88.     <div id="ex_view2">
  89.     HTML5에서 지원되지 않습니다.<br />
  90.       alternate, stylesheet, start, next, prev, contents, index, glossary, copyright, <br />
  91.       chapter, section, subsection, appendix, help, bookmark, nofollow, licence, tag, friend<br />
  92.       이렇게 속성값이 있는데 필요한 기능인지는 모르겠습니다.<br />
  93.     </div>
  94.     
  95.     <hr />
  96.     <b>&lt;a&gt; : 9.속성-shape : 크기, 모양 및 오브젝트로 링크의 좌표를 지정합니다. </b><br /><br />
  97.     <div id="ex_view2">
  98.     HTML5에서 지원되지 않습니다.<br />
  99.       파이어 폭스와 오페라에서만 지원됩니다.<br />
  100.       모든 브라우저에서 작동 이미지지도를 만들 &lt;AREA&gt; 요소를 사용하면 됩니다.<br />
  101.       &lt;AREA&gt; 요소는 &lt;img&gt; 태그에서 설명하겠습니다.<br />
  102.     </div>
  103.     
  104.     <hr />
  105.     <b>&lt;a&gt; : 10.속성-download : 다운로드 할 수있는 하이퍼 링크의 대상을 지정합니다. </b><br /><br />
  106.     <div id="ex_view2">
  107.     HTML5에서 새로 생성된 속성입니다.<br />
  108.       파이어 폭스와 크롬에서만 지원됩니다.<br />
  109.       올바른 파일 확장자를 감지하고 파일을 추가합니다.(.img, .pdf, .txt, .html, etc.)<br />
  110.     현재 파일이 XHTML이라 생략합니다.<br />
  111.     </div>
  112.     
  113.     <hr />
  114.     <b>&lt;a&gt; : 11.속성-media : 대상 URL이 특수 장치(아이폰과 같은), <br />
  115.     음성 또는 인쇄 매체를 위해 설계 지정하는 데 사용됩니다.  </b><br /><br />
  116.     <div id="ex_view2">
  117.     HTML5에서 새로 생성된 속성입니다.<br />
  118.     링크 된 문서가 최적화되어 어떤 미디어 / 디바이스를 지정합니다.<br />
  119.     현재 파일이 XHTML이라 생략합니다.<br />
  120.     </div>
  121.     
  122.     <hr />
  123.     <b>&lt;a&gt; : 12.속성-type  : 링크 된 문서의 MIME 타입을 지정합니다. </b><br /><br />
  124.     <div id="ex_view2">
  125.     HTML5에서 새로 생성된 속성입니다.<br />
  126.     현재 파일이 XHTML이라 생략합니다.<br />
  127.     </div>
  128.     
  129.     <hr />
  130.     <div id="ex_view2">
  131.       <!-- 2.책갈피로 이동합니다.(1.속성-href :) -->
  132.       <a href="#top">책갈피 위로 이동</a><br />
  133.     </div>
  134.   </body>
  135. </html>

--------------------------------------------------------------------------------------------

위 소스 예제 보기


<a></a>


<a> 한 페이지에서 다른 페이지로 연결하는 데 사용되는 하이퍼 링크를 정의합니다.

<a> href, target, hreflang, name 속성과 설명은 소스에 있습니다.

<a> 속성중 rel, charset, coords, rev, shape, download, media, type는 설명이 부실합니다.


Global Attributes 지원합니다.

Global Event Attributes 지원합니다.


출처&인용 : http://www.w3schools.com/tags/tag_a.asp


저작자표시 비영리 변경금지

'HTML > xhtml문법' 카테고리의 다른 글

<table></table> 테이블 만들기  (0) 2014.01.21
<img></img>-<map></map>-<area><area> 이미지-이미지맵-클릭영역지정  (0) 2014.01.21
<ul></ul>-<li></li> 목록 모양 스타일 - 목록 모양  (0) 2014.01.20
<ol></ol>-<li></li> 목록 번호 스타일 - 목록 번호  (0) 2014.01.20
<hr>, <hr /> 수평선  (0) 2014.01.20
:
BLOG main image
by 로이데스트

공지사항

카테고리

분류 (356)
main (1)
php5 (218)
HTML (36)
javascript (93)
IT 이론과 퍼온정보 (8)
깨작일상 (0)
곧 추가할 내용 (0)
추후 알아볼것들... (0)

태그목록

php시스템 php변수검사 phpDB web_portfolio php파일 php이미지 php상수 php배열키 html5 php배열 portfolio complete html5문법 php배열포인터 xhtml문법 php정렬 정규표현식 dom문법 php압축파일 php시간 php문자열반환 php수반환 php코딩 php문법 css문법 php설정 php배열값 javascript문법

링크

최근에 올라온 글

최근에 달린 댓글

최근에 받은 트랙백

달력

«   2025/02   »
일 월 화 수 목 금 토
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28
Total :
Today : Yesterday :