HTML 5는 기존 HTML 4.01, XHTML 1.0 및 DOM Level 2 HTML 표준을 대체하는 것을 목표로 하는 새로운 웹 표준입니다. Adobe Flash, Microsoft Silverlight 및 Sun JavaFX와 같은 플러그인 기반 RIA(리치 인터넷 애플리케이션)에 대한 브라우저의 필요성이 줄어들기를 희망합니다.
HTML 5는 웹사이트의 현대적인 일반적인 사용법을 반영하는 다양한 새로운 요소와 속성을 제공합니다. 그 중 일부는 <div> 및 <span> 태그와 유사하지만 <nav> 및 <footer>와 같은 특정 의미를 갖습니다. 이러한 태그는 검색 엔진 색인 생성, 작은 화면 장치 및 시각 장애인의 사용을 용이하게 합니다. 또한 표준 인터페이스를 통해 <audio> 태그와 같은 다른 탐색 요소에 대한 새로운 기능을 제공합니다.
HTML 5에서 제공하는 새로운 태그 사용법과 HTML과의 차이점을 살펴보겠습니다.
<article> 태그는 외부 콘텐츠를 정의합니다. 예를 들어 외부 뉴스 제공업체의 새 기사, 블로그의 텍스트, 포럼의 텍스트 등이 있습니다. 또는 다른 외부 소스의 콘텐츠.
HTML5:<article></article>
HTML4:<div></div>
<aside> 태그는 기사 이외의 콘텐츠를 정의합니다. Aside의 내용은 기사의 내용과 관련이 있어야 합니다.
HTML5:<aside>Aside 콘텐츠는 독립적인 콘텐츠이지만 문서 콘텐츠와 관련이 있어야 합니다. </aside>
HTML4: <div>Aside의 콘텐츠는 독립적인 콘텐츠이지만 문서 콘텐츠와 관련되어야 합니다. </div>
<audio> 태그는 음악이나 기타 오디오 스트림과 같은 사운드를 정의합니다.
HTML5:<audio src="someaudio.wav">브라우저가 오디오 태그를 지원하지 않습니다. </audio>
HTML4:<object type="application/ogg" data="someaudio.wav"><param name="src" value="someaudio.wav"></object> ;
<canvas> 태그는 차트 및 기타 이미지와 같은 그래픽을 정의합니다. 이 HTML 요소는 클라이언트 측 벡터 그래픽용으로 설계되었습니다. 자체 동작은 없지만 클라이언트 JavaScript에 그리기 API를 노출하므로 스크립트가 캔버스에 원하는 것은 무엇이든 그릴 수 있습니다.
HTML5:<canvas id="myCanvas" width="200" height="200"></canvas>
HTML4:<object data="inc/hdr.svg" type=" image/svg+xml" width="200" height="200"></object>
<command> 태그는 라디오 버튼, 체크박스, 버튼과 같은 명령 버튼을 정의합니다.
HTML5: <command onclick=cut()" label="cut">
HTML4: 없음
<datalist> 레이블은 선택적 데이터 목록을 정의합니다. 다음과 함께 사용됩니다. 입력 요소를 사용하면 입력 값의 드롭다운 목록을 만들 수 있습니다.
HTML5: <datalist></datalist>
HTML4: 콤보 상자를 참조하세요.
<details> 요소의 세부정보를 보거나 클릭하여 숨길 수 있습니다. <legend>를 사용하여 사용자에게 표시되는 세부정보 제목을 만들고 클릭하면 세부정보가 열리거나 닫힙니다. ;details></details>
HTML4: <dl style="display:hidden"></dl>
HTML4: <object data="flash.swf" type="application/x-shockwave-flash"></object> ;
<figcaption> 태그는 그림 요소의 제목을 정의합니다. "figcaption" 요소는 "그림" 요소의 첫 번째 또는 마지막 하위 요소로 배치되어야 합니다.
HTML4: 없음
HTML5: <Figure><figcaption>중국</figcaption><p>중화인민공화국은 1949년에 탄생했습니다...</p></Figure>
HTML4: < ;dl><h1>PRC</h1><p>중화인민공화국은 1949년에 탄생했습니다...</p></dl>
<footer> 섹션이나 문서의 바닥글입니다. 일반적으로 작성자 이름, 문서 작성 날짜 및/또는 연락처 정보가 포함됩니다.
HTML5: <footer></footer>
HTML4: <div></div>
<header> 태그는 섹션이나 문서의 헤더를 정의합니다.
HTML5: <header></header>
HTML4: <div></div>
<hgroup> 태그는 웹 페이지 또는 섹션을 표시하는 데 사용됩니다. 결합.
HTML5: <hgroup></hgroup>
HTML4: <div></div>
<keygen> 태그는 생성된 키를 정의합니다.
HTML5: <keygen>
HTML4: 없음
<mark> 주로 사용자에게 강조 표시해야 하는 텍스트를 시각적으로 표시하는 데 사용됩니다. <mark> 태그의 일반적인 적용은 검색 결과에서 사용자에게 검색 키워드를 강조하는 것입니다.
HTML5: <mark></mark>
HTML4: <span></span>
<meter> 태그는 가중치와 측정값을 정의합니다. 최대값과 최소값이 알려진 측정에만 사용하십시오. 측정 범위는 요소의 텍스트나 최소/최대 속성에서 정의되어야 합니다.
HTML5: <meter></meter>
HTML4: 없음
<nav> 태그는 탐색 링크의 일부를 정의합니다.
HTML5: <nav></nav>
HTML4:<ul></ul>
<output> 스크립트.
HTML5: <output></output>
HTML4: <span></span>
<progress> 태그가 실행 중인 프로세스입니다. <progress> 태그를 사용하면 JavaScript에서 시간이 많이 걸리는 기능의 진행 상황을 표시할 수 있습니다.
HTML5: <progress></progress>
HTML4: 없음
<rp> 태그는 Ruby 주석에서 Ruby를 지원하지 않는 브라우저에 표시되는 콘텐츠를 정의하는 데 사용됩니다. 요소 .
HTML5: <ruby>汉<rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt></ruby>
HTML4 : 없음
<rt> 태그는 문자(중국어 음성 기호 또는 문자)의 해석이나 발음을 정의합니다.
HTML5: <ruby>汉<rt> ㄏㄢˋ </rt></ruby>
HTML4: 없음 또는 문자).
HTML4 : 없음
<section> 태그는 문서의 섹션(섹션, 섹션)을 정의합니다. 장, 머리글, 바닥글 또는 문서의 기타 부분 등입니다.
HTML4: <div></div>
<source> 태그는 미디어 요소(예: <video> 및 <audio>)에 대한 미디어 리소스를 정의합니다.
HTML5: <source>
HTML4: <param>
<summary> 태그에는 세부정보 요소의 제목이 포함됩니다. "세부정보" 요소는 세부정보를 설명하는 데 사용됩니다. 문서 또는 문서 조각. "요약" 요소는 "세부사항" 요소의 첫 번째 하위 요소여야 합니다.
HTML5: <details><summary>HTML 5</summary>이 문서에서는 HTML 5에 대해 배워야 할 모든 내용을 설명합니다.</details>
HTML4: 없음
< ;time> 태그는 날짜나 시간, 또는 둘 다를 정의합니다.
HTML5: <time></time>
HTML4: <span></span>
<video> 태그는 동영상 클립이나 기타 동영상을 정의합니다. 비디오 스트림.
HTML5: <video src="movie.ogg"controls="controls">귀하의 브라우저는 비디오 태그를 지원하지 않습니다. </video>
HTML4:<object type="video/ogg" data="movie.ogv"><param name="src" value="movie.ogv"></object> ;
제거된 요소
다음 HTML 4.01 요소는 HTML5에서 제거되었습니다:
<acronym>
<applet> 🎜><basefont>
<big>
<center>
<dir>
<font> 🎜><프레임>
<프레임세트>
<noframes>
<strike>
<tt> 🎜>
