[HTML] Tag ; a, abbr, acronym

[HTML/HTML5] Tag ; a, abbr, acronym

01. [ a ]
☞ 정의 :  a요소는 텍스트에 링크를 설정합니다.
 
☞ 속성(Property) :
href : 링크 주소를 지정합니다.
target : 링크를 어떤 프레임에 열것인지를 결정합니다.
_blank : 새창에 엽니다.
_parent : 부모창에 엽니다.
_self : 자신의 창에 엽니다.
_top : 화면이 여러 프레임으로 이루어져있는 경우 모든 프레임을 지우고 전체 화면에 엽니다.
[name] : 지정된 이름에 링크를 엽니다.
☞ 설명 :
a 요소는 문단, 목록, 테이블뿐만 아니라 섹션 전체를 감쌀 수도 있습니다.
a 요소안에 버튼이나 링크등 인터렉티브한 요소가 포함되어 있으면 안됩니다.
 
☞ 링크의 상태 :
아래 상태들은 순서대로 정의 해야 의도한 대로 스타일을 적용할 수 있습니다. 만약 active를 hover보다 먼저 정의 했다면 hover가 active를 오버라이드 하여 active상태를 볼 수가 없게 됩니다.
link : 기본적인 링크 상태로 아직 방문한적이 없거나 아무런 행동도 하기전인 상태를 말합니다.
visited : 방문한 적이 있는 링크의 상태를 말합니다.
hover : 마우스 커서가 링크위에 올라가 있는 상태를 말합니다.
focus : 링크에 키보드등을 이용해서 포커스가 위치해있는 상태를 말합니다.
active : 마우스를 눌렀다가 놓는 동안의 상태를 말합니다.
☞ 예제 :

<nav>
    <ul>
        <li> <a href="/">Home</a> </li>
        <li> <a href="/news">News</a> </li>
        <li> <a href="/product">Product</a> </li>
        <li> <a>Examples</a> </li>
        <li> <a href="/legal">Legal</a> </li>
        <li> <a href="/blog" target="_blank">Blog</a></li>        
    </ul>
</nav>

★

02. [ abbr ]
☞ 정의 :  abbr요소는 텍스트를 생략어(abbreviated form)로 지정합니다.
☞ 속성
title : 약어 전체의 의미를 지정합니다.
☞ 설명 :  요소위에 마우스를 올리면 title속성의 내용이 툴팁으로 나옵니다.
※ 생략어와 두문자어의 차이
생략어는 스펠링을 한자씩 발음하고, 두문자어는 한 단어처럼 발음한다는 차이가 있습니다.

<!-- 생략어 Abbreviated Form : 에이치 티 엠엘 이라고 한자씩 발음 -->
<p>I do <abbr title="Hypertext Markup Language">HTML</abbr></p>

<!-- 두문자어  Acronym : 램이라고 한 단어처럼 발음 -->
<acronym title="Random Access Memory">RAM</acronym>

<p>최근 <abbr title="Information Technology">IT</abbr> 의 진보에 의해 
지금까지 "잠재적 노동력"이었던 주부 등이
<acronym title="Small Office/Home Office">SOHO</acronym>의 형태로 
재택근무를 하는 것이 가능해 졌다</p>

03. [ acronym ]
☞ 정의
acronym요소는 텍스트를 두문자어(initial letter)로 지정합니다.
 
☞ 속성
title : 약어의 전체 의미를 지정합니다.
☞ 설명
요소위에 마우스를 올리면 title속성의 내용이 툴팁으로 나옵니다.
 
※ 생략어와 두문자어의 차이
생략어는 스펠링을 한자씩 발음하고, 두문자어는 한 단어처럼 발음한다는 차이가 있습니다.