HTML5, abbr 태그 알아보기
- HTML/HTML 기초
- 2020. 8. 2.
abbr 태그는 abbreviation(약자, 약어)의 약자로 마우스 오버 액션에 반응하여 해당 태그 부분에 마우스 커서가 이동하면 윈도우즈 도움말 형식처럼 입력해둔 문장이 나타나게 됩니다.
만약 아래와 같은 코드를 입력하였다고 가정해 보겠습니다.
<html lang="ko">
<head>
<meta charset="utf-8">
<title>HTML</title>
</head>
<body>
<abbr title="abbreviation:약자, 약어">
abbr</abbr> 태그는 마우스에 반응하여 나타나는 글자를 만들 경우에 주로 사용하며 약자의 해설 등에 쓰입니다.
</body>
</html>
아래의 내용은 위의 코드를 그대로 소스 코드로 옮겨 넣은 내용입니다. abbr 부분에 마우스 커서를 대면 약자의 내용을 보여주게 됩니다.
abbr 태그는 마우스에 반응하여 나타나는 글자를 만들 경우에 주로 사용하며 약자의 해설 등에 쓰입니다.
abbr 태그에서는 주의해야 할 점이 있는데 abbr title="내용"에서 내용에 들어가는 텍스트는 공백이나 탭, 줄바꿈을 마치 이전 포스팅에서 배웠던 Pre태그처럼 쓰였던 그대로를 반영하게 됩니다. 따라서, abbr태그의 내용을 작성할 경우에는 작성하는 그 모습 그대로 반영된다는 점을 유의하여 띄어쓰기 등에 특히 유의해야 합니다.
'HTML > HTML 기초' 카테고리의 다른 글
| HTML5, <mark> 태그 알아 보기 (0) | 2020.08.02 |
|---|---|
| HTML5, <sup> <sub> 태그 알아 보기 (0) | 2020.08.02 |
| HTML5, Pre 태그 알아 보기 (0) | 2020.08.02 |
| 웹, HTML5 기본 구조와 용어의 의미 정리 (0) | 2020.08.01 |