![[HTML] 태그](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FBYCEd%2Fbtq8ftO0XPP%2F8fzX77x7CWXTtcY1JuMEEK%2Fimg.png)
쓰던것만 쓰다보니.. 분위기도 전환시키고 좀 더 탄탄한 마크업을 위해 주기적으로 봐야할 html 태그들..
HTML 태그(tag)는 HTML 요소(element)라고도 부르며, HTML 문서를 구성하는 기본 단위입니다.
: HTML5에서 새롭게 추가된 태그
| 태그 | 설명 | |
| <!-- --> | 주석(comment)을 정의함. | |
| <!DOCTYPE> | 해당 문서(document)의 타입을 정의함. | |
| <a> | 다른 콘텐츠와 연결되는 하이퍼링크(hyperlink)를 정의함. | |
| <abbr> | 축약형(abbreviation)이나 머리글자로만 된 단어(acronym)를 정의함. | |
| <acronym> | 머리글자로만 된 단어(acronym)를 정의함. HTML5에서는 더 이상 지원하지 않으며, 대신 <abbr> 요소를 사용함. |
|
| <address> | 문서나 글의 저자 또는 회사와 연락할 수 있는 정보를 명시함. | |
| <applet> | 문서에 포함되는 애플릿(웹 페이지에 포함되어 작은 기능을 수행하는 프로그램)을 정의함. HTML5에서는 더 이상 지원하지 않으며, 대신 <embed> 요소나 <object> 요소를 사용함. |
|
| <area> | 이미지 맵(image-map)에서 하이퍼링크가 연결될 영역을 정의함. | |
| <article> | |
해당 문서나 페이지 또는 사이트와는 완전히 독립적으로 구성할 수 있는 요소를 정의함. |
| <aside> | |
페이지의 다른 콘텐츠들과 약간의 연관성을 가지고 있지만 해당 콘텐츠들로부터 분리시킬 수 있는 콘텐츠로 구성된 페이지 영역을 정의함. |
| <audio> | |
음악이나 오디오 스트림과 같은 사운드를 정의함. |
| <base> | 해당 문서의 모든 상대 주소(relative URL)에 대한 기본 URL과 target 속성값을 정의함. | |
| <basefont> | 해당 문서의 모든 텍스트에 대한 색상, 크기 및 폰트의 기본값을 정의함. HTML5에서는 더 이상 지원하지 않으며, 대신 CSS를 사용함. |
|
| <bdi> | |
주위의 텍스트들과는 다른 방향으로 써지는 텍스트 영역을 정의함. |
| <bdo> | 자식 요소의 텍스트 방향성(text directionality)을 정의함. | |
| <big> | 글자 크기가 큰 텍스트를 정의함. HTML5에서는 더 이상 지원하지 않으며, 대신 CSS를 사용함. |
|
| <blockquote> | 다른 출처로부터 인용된 영역을 정의함. | |
| <body> | 해당 문서의 콘텐츠 영역을 정의함. | |
| <br> | 행 바꿈(line-break)을 정의함. | |
| <button> | 클릭할 수 있는 버튼을 정의함. | |
| <canvas> | |
자바스크립트와 같은 스크립트를 이용하여 그래픽 콘텐츠를 그릴 때 사용함. |
| <caption> | 테이블의 캡션(caption)을 정의함. | |
| <center> | 가운데로 정렬되는 텍스트를 정의함. HTML5에서는 더 이상 지원하지 않으며, 대신 CSS를 사용함. |
|
| <cite> | 예술 작품과 같은 창작물의 제목을 정의함. | |
| <code> | 컴퓨터 코드(code)의 일부분을 나타냄. | |
| <col> | <colgroup> 요소에 속하는 각 열(column)의 속성을 정의함. | |
| <colgroup> | 테이블에서 서식 지정을 위해 하나 이상의 열을 그룹으로 묶을 때 사용함. | |
| <data> | |
특정 콘텐츠에 기계가 읽을 수 있는(machine-readable) 형태의 값(value)을 덧붙여 나타낼 때 사용함. |
| <datalist> | |
<input> 요소에서 사용하기 위한 옵션들의 리스트를 미리 정의함. |
| <dd> | 용어와 그에 대한 설명을 리스트 형식으로 보여주는 <dl> 요소에서 설명(description) 부분을 정의함. | |
| <del> | 텍스트 한가운데 라인을 추가하여 문서에서 삭제된 텍스트를 표현함. | |
| <details> | |
사용자가 직접 조작하여 보거나 숨길 수 있는 부가적인 세부사항(additional details)을 명시함. |
| <dfn> | HTML에서 용어(term)의 정의를 나타냄. | |
| <dialog> | |
대화 상자(dialog box)나 대화 윈도우(dialog window)를 정의함. |
| <dir> | HTML 리스트(list)를 정의함. HTML5에서는 더 이상 지원하지 않으며, 대신 <ul> 요소를 사용함. |
|
| <div> | HTML 문서에서 특정 영역이나 구획을 정의함. | |
| <dl> | 용어와 그에 대한 설명을 리스트 형식으로 정의함. | |
| <dt> | 용어와 그에 대한 설명을 리스트 형식으로 보여주는 <dl> 요소에서 용어(term) 부분을 정의함. | |
| <em> | 강조된 텍스트를 표현함. | |
| <embed> | |
외부 애플리케이션이나 대화형 콘텐츠를 포함시킬 수 있는 컨테이너를 정의함. |
| <fieldset> | <form> 요소에서 연관된 요소들을 하나의 그룹으로 묶을 때 사용함. | |
| <figcaption> | |
<figure> 요소의 캡션(caption)을 정의함. |
| <figure> | |
삽화나 다이어그램, 사진 등과 같이 문서의 주요 흐름과는 독립적인 콘텐츠를 정의함. |
| <font> | 텍스트의 폰트, 색상 그리고 크기를 정의함. HTML5에서는 더 이상 지원하지 않으며, 대신 CSS를 사용함. |
|
| <footer> | |
문서나 특정 섹션의 푸터(footer)를 정의함. |
| <form> | 사용자로부터 입력을 받을 수 있는 HTLM 입력 폼(form)을 정의함. | |
| <frame> | <frameset> 요소에 포함되는 하나의 프레임(frame)을 정의함. HTML5에서는 더 이상 지원하지 않음. |
|
| <frameset> | 문서의 레이아웃을 구성하기 위해 사용되는 프레임(frame)들의 집합을 정의함. HTML5에서는 더 이상 지원하지 않음. |
|
| <h1> ~ <h6> | HTML 문서에서 제목(headings)을 정의함. | |
| <head> | 해당 문서에 대한 정보인 메타데이터(metadata)의 집합을 정의함. | |
| <header> | |
문서나 특정 섹션의 헤더(header)를 정의함. |
| <hr> | 콘텐츠 내용에서 주제가 바뀔 때 사용할 수 있는 수평 가로선을 정의함. | |
| <html> | HTML 문서의 루트 요소(root element)를 정의함. | |
| <i> | 기본 텍스트와는 다른 분위기나 음성을 위한 텍스트 영역을 정의함. | |
| <iframe> | 인라인 프레임(inline frame)을 정의함. | |
| <img> | 이미지(image)를 정의함. | |
| <input> | 사용자로부터 입력을 받을 수 있는 입력 필드(input filed)를 정의함. | |
| <ins> | 텍스트 아래쪽에 라인을 추가하여 문서에 추가된 텍스트를 표현함. | |
| <kbd> | 키보드 입력을 나타냄. | |
| <label> | 사용자 인터페이스(UI) 요소의 라벨(label)을 정의함. | |
| <legend> | <fieldset> 요소의 캡션(caption)을 정의함. | |
| <li> | HTML 리스트(list)에 포함되는 아이템(item)을 정의함. | |
| <link> | 해당 문서와 외부 소스(external resource) 사이의 관계를 정의함. | |
| <main> | |
해당 문서의 <body> 요소의 주 콘텐츠(main content)를 정의함. |
| <map> | 클라이언트 사이드 이미지맵(client-side image-map)을 정의함. | |
| <mark> | |
형광펜으로 칠한 것처럼 하이라이트된(highlighted) 텍스트를 정의함. |
| <meta> | 해당 문서에 대한 정보인 메타데이터(metadata)를 정의함. | |
| <meter> | |
분수 값이나 범위(gauge) 내에서 특정 스칼라 값이 어느 정도인지를 표현함. |
| <nav> | |
다른 페이지 또는 현재 페이지의 다른 부분과 연결되는 네비게이션 링크(navigation links)들의 집합을 정의함. |
| <noframes> | 프레임(frame) 기능을 사용하지 않도록 설정했거나, 프레임 기능을 지원하지 않는 브라우저를 위한 별도의 콘텐츠를 정의함. HTML5에서는 더 이상 지원하지 않음. |
|
| <noscript> | 클라이언트 사이드 스크립트(client-side scripts)를 사용하지 않도록 설정했거나, 스크립트를 지원하지 않는 브라우저를 위한 별도의 콘텐츠를 정의함. | |
| <object> | 외부 리소스의 종류에 따라 문서 내에서 처리하는 방식을 변경할 수 있는 임베디드 객체(embedded object)를 정의함. | |
| <ol> | 순서가 있는 HTML 리스트(list)를 정의함. | |
| <optgroup> | 옵션 메뉴를 제공하는 드롭다운 리스트(drop-down list)에서 사용되는 옵션들의 그룹을 정의함. | |
| <option> | 옵션 메뉴를 제공하는 드롭다운 리스트(drop-down list)에서 사용되는 하나의 옵션을 정의함. | |
| <output> | |
스크립트 등에 의해 수행된 계산의 결과나 사용자의 액션에 의한 결과를 나타냄. |
| <p> | 문단(paragraph)을 정의함. | |
| <param> | <object> 요소에 의해 호출되는 플러그인의 매개변수(parameter)를 정의함. | |
| <picture> | |
<img> 요소의 다중 이미지 리소스(multiple image resources)를 위한 컨테이너를 정의함. |
| <pre> | 미리 정의된 형식(preformatted)의 텍스트를 정의함. | |
| <progress> | |
작업의 진행률을 나타냄. |
| <q> | 짧은 인용구를 정의함. | |
| <rp> | |
루비 주석을 지원하지 않는 브라우저를 위한 대체 내용을 정의함. |
| <rt> | |
루비 주석에서 발음이나 설명을 나타내는 윗첨자를 정의함. |
| <ruby> | |
해당 문자의 발음이나 설명을 작은 크기의 윗첨자로 알려주는 루비 주석(ruby annotation)을 정의함. |
| <s> | 텍스트 한가운데 라인을 추가하여 더 이상 정확하지 않거나 관련이 없는 텍스트를 표현함. | |
| <samp> | 컴퓨터 프로그램의 샘플 또는 인용 출력(output)을 나타냄. | |
| <script> | 자바스크립트와 같은 클라이언트 사이드 스크립트(client-side scripts)를 정의함. | |
| <section> | |
HTML 문서에 포함된 독립적인 섹션(section)을 정의함. |
| <select> | 옵션 메뉴를 제공하는 드롭다운 리스트(drop-down list)를 정의함. | |
| <small> | 글자 크기가 작은 텍스트를 정의함. | |
| <source> | <audio> 요소나 <video> 요소에서 사용할 수 있는 다중 미디어 자원(multiple media resources)을 정의함. | |
| <span> | HTML 문서에서 인라인 요소(inline-element)들을 하나로 묶을 때 사용함. | |
| <strike> | 텍스트 한가운데 라인을 추가할 때 사용함. HTML5에서는 더 이상 지원하지 않으며, 대신 <del> 요소나 <s> 요소를 사용함. |
|
| <strong> | 해당 콘텐츠의 중요성이나 심각함, 긴급함 등을 강조함. | |
| <style> | 해당 HTML 문서의 스타일 정보를 정의함. | |
| <sub> | 아랫첨자(subscript) 텍스트를 표현함. | |
| <summary> | |
<details> 요소에 의해 생성되는 대화형 위젯에서 기본적으로 보이는 제목을 정의함. |
| <sup> | 윗첨자(superscript) 텍스트를 표현함. | |
| <svg> | SVG 그래픽을 위한 컨테이너를 정의함. | |
| <table> | 데이터를 포함하는 셀(cell)들의 행과 열로 구성된 2차원 테이블을 정의함. | |
| <tbody> | 테이블에서 내용 콘텐츠(body content)들을 하나의 그룹으로 묶을 때 사용함. | |
| <td> | 테이블에서 하나의 셀(cell)을 정의함. | |
| <template> | |
추가되거나 복사될 수 있는 HTML 요소들을 정의함. |
| <textarea> | 사용자가 여러 줄의 텍스트를 입력할 수 있는 텍스트 입력 영역을 정의함. | |
| <tfoot> | 테이블에서 푸터 콘텐츠(footer content)들을 하나의 그룹으로 묶을 때 사용함. | |
| <th> | 테이블에서 제목이 되는 헤더 셀(header cell)들을 정의함. | |
| <thead> | 테이블에서 헤더 콘텐츠(header content)들을 하나의 그룹으로 묶을 때 사용함. | |
| <time> | |
사람이 읽을 수 있는(human-readable) 형태의 날짜와 시간 데이터를 정의함. |
| <title> | 해당 문서의 제목(title)을 정의함. | |
| <tr> | 테이블에서 셀들로 이루어진 하나의 행(row)을 정의함. | |
| <track> | |
<audio>나 <video> 요소와 같은 미디어 요소를 위한 텍스트 트랙(track)을 정의함. |
| <tt> | 텔레타이프 텍스트(teletype text)를 나타냄. HTML5에서는 더 이상 지원하지 않으며, 대신 CSS를 사용함. |
|
| <u> | 철자가 틀린 단어나 중국어의 고유 명사처럼 문체상 일반적인 텍스트와는 달라야만 하는 텍스트를 표현함. | |
| <ul> | 순서가 없는 HTML 리스트(list)를 정의함. | |
| <var> | 변수(variable)를 정의함. | |
| <video> | |
무비 클립(movie clip)이나 비디오 스트림(video stream)과 같은 비디오를 정의함. |
| <wbr> | |
단어 중간에서 행바꿈될 수 있는(line-break) 위치를 정의함. |
728x90
반응형
'Web > Markup | WEB' 카테고리의 다른 글
| [웹접근성] 꾸밈 요소의 이미지 처리 (0) | 2022.06.27 |
|---|---|
| [eDM] 이메일 정보성 메일 html 만들때 참고 (0) | 2021.10.29 |
| [SEO] 메타태그 최적화 (0) | 2021.06.07 |
| [퍼블리싱] 퍼블리셔 (0) | 2021.02.10 |
| 파비콘 (0) | 2018.05.30 |