English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

HTML5 기본 가이드

HTML5 API

HTML5 미디어

HTML5 그래픽

HTML5 교재

HTML5는 웹 콘텐츠를 구축하는 방법으로서의 언어 설명 방식입니다. HTML5는 인터넷의 다음代的 표준으로, 인터넷 콘텐츠를 구축하고 표시하는 방법으로, 인터넷의 핵심 기술 중 하나로 간주됩니다. HTML은1990년,1997년 HTML4로 인터넷 표준이 되었으며, 인터넷 애플리케이션 개발에 널리 사용됩니다.

HTML5는 최신 수정된 HTML 버전입니다.2014년10월 월드 위버 네트워크(W3C가 표준을 완성했습니다.

HTML5의 설계 목적은 이동 장치에서 멀티미디어를 지원하는 것입니다.
HTML5는 웹의 핵심 언어인 HTML의 규범입니다. 사용자가 어떤 방법으로든 웹 브라우징을 할 때 보는 내용은 모두 HTML 형식으로, 브라우저에서 특정 기술을 통해 인식 가능한 형태로 변환됩니다.

HTML5 단순하고 쉽게 배울 수 있습니다.

HTML이 무엇인가요?5?

HTML5 은 다음代的 HTML 표준입니다.

HTML, HTML 4.01의 이전 버전은 1999 년. 이후로, 웹 세계는 많은 변화를 겪었습니다.

HTML5 는 여전히 완성되고 있지만, 대부분의 현대 브라우저는 일부 HTML5 지원.

HTML5 는 어떻게 시작되었는가?

HTML5 는 W3C와 WHATWG가 협력한 결과, WHATWG는 Web Hypertext Application Technology Working Group을 의미합니다.

WHATWG는 웹 폼과 애플리케이션에 집중하며, W3C는 XHTML에 집중했습니다. 2.0. 2006 년, 양측은 새로운 HTML 버전을 만들기 위해 협력하기로 결정했습니다.

HTML5 에서 몇 가지 흥미로운 새로운 기능:

  • 그래픽을 그리는 canvas 요소.

  • 미디어 재생에 사용되는 video 및 audio 요소.

  • 로컬 오프라인 저장소(localStorage 및 sessionStorage)에 대한 더 나은 지원.

  • article, footer, header, nav, section와 같은 새로운 특수 내용 요소.

  • calendar, date, time, email, url, search와 같은 새로운 폼 컨트롤.

  • HTML5웹을 성숙한 애플리케이션 플랫폼으로带入하며, 이 플랫폼에서는 비디오, 오디오, 이미지, 애니메이션 및 장치와의 상호작용이 규제됩니다.

HTML5 !DOCTYPE

<!doctype> 선언은 HTML5 문서의 첫 번째 행에서 매우 간단하게 사용할 수 있습니다:

<!DOCTYPE　html>

　 이렇게 하면 현재 지원하지 않는 HTML을5의 브라우저는 표준 모드로 분석됩니다. 이는 그들이 해당 HTML을 분석할 것을 의미합니다.5에서는 과거의 HTML 태그의 일부를 호환하며, 그들이 HTML을 지원하지 않는 것을 무시합니다.5의 새로운 기능.
이 doctype는 이전보다 짧고 간단하여 기억하기 쉽고 다운로드해야 할 바이트수를 줄입니다.

meta charset로 문자 집합을 선언하십시오

　　 한 페이지에서 첫 번째로 하는 일은 일반적으로 사용하는 문자 집합을 선언하는 것입니다. 이전 버전의 HTML에서는 매우 복잡한<meta> 요소였지만, 지금은 매우 간단해졌습니다:

<meta　charset="UTF-8">

　　　 을<head>에 넣으세요. 어떤 브라우저에서는 선언된 문자 집합과 예상치 않은 것이 다를 때, 그들은 HTML 문서를 다시 해석합니다. 또한, 현재 UTF를 사용하지 않고 있다면-8를 권장합니다. 이编码를 사용하면 파일에서 문자를 처리하는 다른 스크립트에 대해 더 간단해집니다.
　 고려할 가치가 있는 것은 HTML5사용할 수 있는 문자 집합을 제한하며, 그들은 호환해야 합니다8ASCII. 이렇게 하는 이유는 보안을 강화하고 특정 유형의 공격을 방지하기 위해입니다

가장 작은 HTML5문서

아래는 간단한 HTML5문서:

<!DOCTYPE　html>
<html>
<head>
<meta charset="utf-8">
<title>저는 html5문서 제목</title>
</head>
　
<body>
html5문서 내용......
</body>
　
</html>

주의: 중국 웹 페이지에 대해서는 <meta charset="utf"를 사용해야 합니다-8"> 인코딩을 선언하지 않으면 애취하게 됩니다.

HTML5 의 개선

  • 새로운 요소

  • 새로운 속성

  • CSS를 완전히 지원3

  • Video와 Audio

  • 2D/3D 그래픽

  • 로컬 스토리지

  • 로컬 SQL 데이터

  • 웹 응용 프로그램

HTML5 멀티미디어

HTML을 사용하여5 웹 페이지에서 간단히 비디오(video)와 오디오(audio)를 재생할 수 있습니다

HTML5 응용 프로그램

HTML을 사용하여5 응용 프로그램을 간단히 개발할 수 있습니다

  • 로컬 데이터 저장

  • 로컬 파일에 접근

  • 로컬 SQL 데이터

  • 캐시 참조

  • Javascript 작업자

  • XHTMLHttpRequest 2

HTML5 그래픽

HTML을 사용하여5 그래픽을 간단히 그릴 수 있습니다:

HTML5 CSS를 사용하여3

  • 새로운 선택자

  • 새로운 속성

  • 애니메이션

  • 2D/3D 변환

  • रOUNDED Corner

  • 그림자 효과

  • 다운로드 가능한 폰트

CSS를 더 알아보세요3지식을 더 알고 싶다면 이 사이트에서 CSS3 튜토리얼.

의미 있는 요소

HTML5 이렇게 보이는 의미 있는 요소를 추가했습니다:

태그설명
<article>페이지의 독립적인 내용 영역을 정의
<aside>페이지의 사이드바 내용을 정의
<bdi>부모 요소의 텍스트 방향 설정에서 벗어나는 텍스트를 설정할 수 있도록 허용
<command>단일 선택 버튼, 체크 박스 또는 버튼과 같은 명령 버튼을 정의
<details>문서나 문서의 특정 부분의 세세한 내용을 설명하는 데 사용
<dialog>도대론을 정의하는 예로 대화 상자
<summary>details 요소를 포함하는 태그를 설명
<figure>독립된 스트림 내용(이미지, 차트, 사진, 코드 등)을 정의합니다.
<figcaption><figure> 요소의 제목을 정의합니다.
<footer>section 또는 document의 푸터를 정의합니다.
<header>문서의 헤더 영역을 정의합니다.
<mark>표시된 텍스트를 정의합니다.
<meter>도량衡을 정의합니다. 최대와 최소 값을 알고 있는 도량衡에만 사용됩니다.
<nav>네비게이션 링크의 일부를 정의합니다.
<progress>모든 유형의 작업의 진행 상황을 정의합니다.
<ruby>ruby 주석(중국어 주파음 또는 문자)을 정의합니다.
<rt>문자(중국어 주파음 또는 문자)의 설명이나 발음을 정의합니다.
<rp>ruby 주석에서 사용하여 ruby 요소를 지원하지 않는 브라우저에 표시할 내용을 정의합니다.
<section>문서 내의 섹션(section, 구역)을 정의합니다.
<time>날짜나 시간을 정의합니다.
<wbr>텍스트에서 적절한 위치에 라인피드를 추가할 수 있습니다.

HTML5 지능형 표单

새 표单 요소, 새 속성, 새 입력 유형, 자동 검증.

제거된 요소

以下的 HTML 4.01 요소는 HTML5중에서는 제거되었습니다:

  • <acronym>

  • <applet>

  • <basefont>

  • <big>

  • <center>

  • <dir>

  • <font>

  • <frame>

  • <frameset>

  • <noframes>

  • <strike>

HTML5비디오 재생 예제

우리의 HTML 편집기를 통해 HTML을 편집하고, 결과를 확인하기 위해 버튼을 클릭할 수 있습니다.

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">　
<title>기본 튜토리얼 웹(oldtoolbag.com)</title>　
</head>
<body>
　
<video width="320" height="240" controls>
　　<source src="movie.mp4" type="video/mp4">
　　<source src="movie.ogg" type="video/ogg">
　　당신의 브라우저는 video 태그를 지원하지 않습니다。
</video>
　
</body>
</html>
테스트해 보세요 ‹/›

HTML5 브라우저 지원

최신 버전의 Safari, Chrome, Firefox 및 Opera는 일부 HTML을 지원합니다.5 기능을 지원합니다. Internet Explorer 9 일부 HTML5 기능

IE9 다음 버전 브라우저는 HTML과 호환됩니다5의 방법을 사용하여 이 사이트의 정적 자원의 html5shiv 패키지：

<!--[if　lt　IE　9]>
　　　　<script　src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->

로드 후, 새 태그의 CSS를 초기화합니다：

/*html5*/
article,aside,dialog,footer,header,section,nav,figure,menu{display:block}

HTML5 참조 매뉴얼

이 사이트에서 HTML5 의 태그 및 속성 설명, 자세한 내용은 클릭하세요 HTML5참조 매뉴얼。

HTML5 내장 SVG