14 HTML 태그의 제왕

1.

 

1)

태그가 웹의 왕국이라면,

 

이 태그는 웹 왕국의 제왕 이다.

 

현대의 HTML은 150 가지의 태그로 구성되어 있지만,

이 모든 태그들이 이 태그 아래에 있다.

 

2)

검색 엔진들은 이 태그 덕분에 전 세계의 웹을 항해 했다.

수많은 웹 페이지들을 발견할 수 있었고,

이 태그 덕분에 최고의 검색 결과를 만들 수 있었다.

 

이 태그 가 없다면 검색 엔진은 존재 하지 않는다.

 

3)

이 태그 는 도시로 따지면, 도시의 길이며,

인체로 따지면, 인체의 혈관 이다.

 

이 태그 가 없다면, 전 세계의 모든 웹 페이지는 고립된다.

  

4)

이 태그 는 우리가 매일 백 번도 넘게 사용 하고 있었던 태그 이다.

 

5)

HTML의 약자인, HyperText Markup Language의 첫 단어인

HyperText가 바로 이 태그 를 의미 한다.

 

6)

이 태그 의 이름은 anchor의 첫 글자를 딴 a 이다.

 

앵커는 닻을 의미 한다.

 

정보의 바다에 정박한다는 의미의 시적인 표현인 것이다.

 

2.

a 태그는 어떤 기능일까 ?

 

바로 링크 이다.

 

3.

<a> 태그를 이용해 링크 만들기.

 

 

<a> 태그를 달아 보았다.

 

 

하지만, 링크가 걸려 있지 않은 모습이다.

 

왜 그러는걸까 ?

 

바로, 링크의 정보가 없기 때문이다.

 

링크는 href 라는 속성을 사용해서 나타낸다.

 

h는 HyperText의 약자이고, == 링크

ref는 reference. 즉, 참조하다 의 약자 이다.

 

>> 링크를 참조 하다. == href 속성.

 

4.

 

 

 

링크가 걸리게 되었다.

 

5.

만약, 링크를 눌렀을 때, 새 창에서 열리게 하고 싶으면 어떻게 해야할까 ?

 

<a> 태그에 target 속성을 추가 하면 된다.

 

 

 

그러면, 이렇게 새 창이 띄워진다.

 

6.

링크를 클릭 하기 전에, 이 링크가 무엇인지를 미리 알려주고 싶으면 어떻게 해야할까 ?

<a> 태그에 title 속성을 추가 한다.

 

 

 

링크를 누르기전, 마우스를 올려보니, 툴팁 처럼 알려주는 모습이다.

 

 

7.

정리

 

1)

<a> 태그 !!!

 

링크를 걸 수 있는 태그를 의미 한다. 

 

2)

href 속성.

 

<a> 태그를 단독적으로 사용하면 링크를 나타낼 수 없다.

 

반드시, href = "링크" 와 같이, href 속성을 같이 사용 한다.

 

3)

target 속성

 

링크를 눌렀을 때, 해당 링크가 새로운 창에서 열리게 하고 싶으면,

target 속성을 사용 한다.

 

target = "_blank"

 

4)

title 속성

 

링크를 누르기 전에, 마우스를 올리면, 해당 링크가 무엇인지를 명시해주는 역할.

 

title = "내용"

 

위의 모든 속성들은, <a> 태그 내부에서 사용 하는 속성.