본문 바로가기
프로그래밍/HTML5

[꿀강] HTML5에서 사라진 태그와 추가된 태그

by 착살의 숲 2018. 8. 28.
반응형

HTML5에서 사라진 태그들이 있다.

대표적으로 HTML3 버전에서 상당히 많이 사용했던 frame 태그는 HTML5에서는 사라지게 됐다.

그럼 어떤 태그들이 사라졌는지 자세히 알아보자.

 

 

1. HTML5에서 사라진 태그

 

태 그

속 성 

 <acronym> 

 영문 축양형 사용 시, 예를 들어 NATO, NASA, GUI 등 

 <applet>

 임베디드 애플릿 사용시

 <basefont>

 글꼴의 형태 정의

 <big>

 글꼴의 크기 지정

 <center>

 텍스트 위치 중앙 정렬

 <dir>

 디렉토리 리스트

 <font>

 글꼴

 <frame>

 프레임

 <frameset>

 프레임 부속 태그

 <noframes>

 프레임 부속 태그

 <strike>

 글꼴 효과(글 취소 효과)

 <tt>

 글꼴 효과(타자기 효과)

 <u>

 글꼴 효과 언더라인

 <xmp>

 pre 태그와 동일 효과

 

HTML5에서는 표현을 위해 필요했던 태그들이 대부분 사라졌다.

예를 들어 basefont, big, center, font, tt, u 등 글꼴 표현에 많이 사용했던 태그이지만 대부분 CSS로 대체되었다.

 

 

 

 

2. HTML5에서 추가된 태그

 

태 그 

속 성 

 <article>

 웹 페이지의 본문을 정의할 때 사용

 <aside>

 Article의 내용을 보충해 주는 역할을 하는 컨텐츠를 넣을 때 사용

 주로 서브메뉴를 만들 떄 사용

 <audio>

 오디오를 재생할 때 사용

 <canvas>

 그래픽을 보여줄 때 사용

 <command>

 명령 버튼을 만들 때 사용

 <datalist>

 드롭다운 리스트를 만들 때 사용

 <details>

 상세한 내용을 보여줄 때 사용

 <embed>

 플러그인이나 플래시 요소를 보여줄 때 사용

 <figcaption>

 <figure>와 함께 사용

 <figure>의 캡션을 추가할 때 사용

 <figure>

 이미지나 사진, 코드 등을 보여줄 때 사용

 <footer>

 footer를 정의할 때 사용

 <header>

 header를 정의할 때 사용

 <hgroup>

 H1부터 H6의 그룹을 만들 때 사용

 <keygen>

 폼에서 사용되며 로컬상에 보안키를 저장하고 공개키는 서버로 보냄

 <mark>

 텍스트에 마크펜으로 칠한 효과

 <meter>

 시각적으로 어느정도 길이를 나타내는지 보여줌

 <nav>

 메인메뉴 및 서브메뉴를 정의할 때 사용

 <output>

 계산된 결과를 나타낼 때 사용

 <progress>

 다운로드 같이 몇%가 남아있는지 표시할 떄 사용

 <section>

 섹션을 정의할 때 사용

 <source>

 오디오 또는 비디오 태그와 같이 사용되며 소스를 나타낼 때 사용

 <summary>

 details 태그와 같이 사용되며 상세한 내용의 요약을 나타냄

 <time>

 문서 내부에 시간을 정의할 때 사용

 <video>

 비디오를 재생할 때 사용

 <wbr>

 문서의 내용이 길어서 다음 라인으로 표시될 때

 

HTML5 문서는 크게 세 부분(header, article, footer)으로 나눌 수 있다.

HTML5의 문서 구조를 보면 이전 버전의 HTML 문서와 비교할 때 표준화되고 체계화된 느낌을 받을 수 있다.

 

 

 

반응형

댓글