English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
HTML5 - это способ описания веб-контента, который является следующим стандартом Интернета и способом создания и представления интернет-контента. Он считается одним из ключевых технологий Интернета. HTML был создан в 1990 году, а в 1997 году HTML4 стал стандартом Интернета и широко используется в разработке интернет-приложений.
HTML5 является наиболее новой версией HTML, которая была завершена разработка стандарта в октябре 2014 года Організацією W3C.
Цель дизайна HTML5 - поддержка мультимедиа на мобильных устройствах.
HTML5 является стандартом языка HTML, являющегося ядром Web, и содержимое, которое пользователи видят при просмотре веб-страниц любыми средствами, изначально представлено в формате HTML, которое затем преобразуется в распознаваемое с помощью некоторых технических методов в браузере
HTML5 прост в изучении.
HTML5 - это стандарт下一代 HTML.
HTML, предшествующая версия HTML 4.01, была создана в 1999 году. С тех пор мир веба претерпел значительные изменения.
HTML5 все еще находится в стадии улучшения. Однако, большинство современных браузеров уже поддерживают некоторые функции HTML5.
HTML5 является результатом сотрудничества W3C и WHATWG, WHEREWG - это Web Hypertext Application Technology Working Group.
WHATWG致力于 web-формы и приложения, а W3C сосредоточен на XHTML 2.0. В 2006 году они решили сотрудничать, чтобы создать новую версию HTML.
Некоторые интересные новые функции HTML5:
Элемент canvas для рисования
Элементы video и audio для воспроизведения медиа
Лучшая поддержка локального хранилища данных (localStorage и sessionStorage)
Новые элементы специального содержания, такие как article, footer, header, nav, section
Новые элементы управления формами, такие как calendar, date, time, email, url, search
HTML5 привел веб в состояние зрелой платформы приложений, на которой видео, аудио, изображения, анимации и взаимодействие с устройствами были стандартизированы.
Декларация <!doctype> должна быть расположена на первой строке HTML5-документа, и она очень проста в использовании:
<!DOCTYPE html>
Таким образом, браузеры, которые еще не поддерживают HTML5, будут использовать стандартный режим анализа, что означает, что они будут анализировать части старых HTML-тегов, совместимых с HTML5, и игнорировать новые функции, которые они не поддерживают.
Этот doctype стал короче и проще, что делает его легче запомнить и уменьшает количество байт, которые необходимо загрузить.
Одной из первых вещей, которые вы делаете на странице, обычно является указание используемого набора символов. В предыдущих версиях HTML это был очень сложный элемент <meta>, теперь он стал очень простым:
<meta charset="UTF-8">
Поместите это в ваш <head>, так как в некоторых браузерах, если указанный набор символов отличается от ожидаемого, они будут заново анализировать HTML-документ. Кроме того, если вы в настоящее время не используете UTF-8, рекомендуется изменить вашу веб-страницу на этот кодировку, так как она упрощает обработку символов различными скриптами в файле.
Стоит отметить, что HTML5 ограничивает доступные наборы символов, они должны быть совместимы с 8-битным ASCII. Это делается для повышения безопасности и предотвращения некоторых типов атак.
Ниже приведен пример простого документа HTML5:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Я являюсь заголовком документа html5</title> </head> <body> содержимое документа html5...... </body> </html>
Внимание: для веб-страниц на китайском языке необходимо использовать декларацию кодировки <meta charset="utf-8">, в противном случае可能出现乱码。
Новые элементы
Новые свойства
Полная поддержка CSS3
Video и Audio
2D/3D графика
Локальное хранение
Локальные SQL данные
Web приложения
Используя HTML5, вы можете легко воспроизводить видео (video) и аудио (audio) на веб-странице.
Используя HTML5, вы можете легко разрабатывать приложения
Локальное хранение данных
Доступ к локальным файлам
Локальные SQL данные
Кэшированные ссылки
Worker JavaScript
XHTMLHttpRequest 2
Используя HTML5, вы можете легко рисовать графики:
Использование <canvas> элементов.
Использование вlined SVG.
Использование 2D преобразования CSS3и3D преобразования CSS3.
Новые селекторы
Новые свойства
Анимации
2D/3D преобразования
Закругленные углы
Эффекты тени
Скачиваемые шрифты
Чтобы узнать больше о CSS3, пожалуйста, ознакомьтесь с Учебник CSS3.
HTML5 добавил множество семантических элементов, как показано ниже:
| Теги | Описание |
| <article> | Определяет независимую область содержимого страницы |
| <aside> | Определяет содержимое боковой панели страницы |
| <bdi> | Позволяет вам установить фрагмент текста, чтобы он не зависел от установки направления текста родительского элемента. |
| <command> | Определяет командные кнопки, например, радио-кнопки, флажки или кнопки |
| <details> | Используется для описания подробностей документа или某一个 его части |
| <dialog> | Определяет диалоговое окно, например, диалоговое окно с уведомлением |
| <summary> | Эти теги содержат заголовок элемента details |
| <figure> | Определяет независимое потоковое содержимое (изображения, диаграммы, фотографии, код и т.д.). |
| <figcaption> | Определяет заголовок элемента <figure>. |
| <footer> | Определяет нижнюю часть section или документа. |
| <header> | Определяет верхнюю часть документа. |
| <mark> | Определяет текст с пометками. |
| <meter> | Определяет меру. Используется только для мер, у которых известны максимальное и минимальное значения. |
| <nav> | Определяет часть навигационной ссылки. |
| <progress> | Определяет прогресс выполнения любого типа задачи. |
| <ruby> | Определяет ruby-комментарий (пиньин или символ). |
| <rt> | Определяет的解释 или произношение символа (пινьин или символа). |
| <rp> | Используется в ruby-комментариях для определения содержимого, которое будет отображаться в браузерах, не поддерживающих элементы ruby. |
| <section> | Определяет раздел (section, абзац) в документе. |
| <time> | Определяет дату или время. |
| <wbr> | Определяет, где в тексте следует добавить символ перевода строки. |
Новые элементы форм, новые атрибуты, новые типы ввода, автоматическая проверка.
Следующие элементы HTML 4.01 были удалены в HTML5:
<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<frameset>
<noframes>
<strike>
С помощью нашего редактора 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>Проверьте, </>
Новые версии Safari, Chrome, Firefox и Opera поддерживают некоторые возможности HTML5. Интернет-Explorer 9 также поддерживает некоторые возможности HTML5.
Методы совместимости браузеров версии IE9 и ниже, использование пакета 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.