Новые элементы HTML5
Начиная с 1999 года, HTML 4,01 изменилось многое. Сегодня некоторые из HTML 4.01 устарели, и эти элементы были удалены или переопределены в HTML5.
Для того, чтобы лучше справиться с современным интернет-приложений, HTML5 добавляет множество новых элементов и функций, таких как: рендеринга графики, мультимедийного контента, лучше структура страницы, лучшей формой обработки и несколько апи перетаскивания элементов, позиционирования, в том числе веб-приложения кэширование, хранение, веб-рабочий, и так далее.
Новые элементы в HTML5
Ниже приведен список новых элементов HTML5, а также описание того, что они используются.
Новые Семантические / Структурные элементы
HTML5 предлагает новые элементы для улучшения структуры документа:
| Тег | Описание |
|---|---|
| <article> | Определяет статью в документе |
| <aside> | Определяет содержание в стороне от содержимого страницы |
| <bdi> | Определяет часть текста, который может быть отформатирован в другом направлении от другого текста |
| <details> | Определяет дополнительные сведения о том, что пользователь может просмотреть или скрыть |
| <dialog> | Определяет диалоговое окно или окно |
| <figcaption> | Определяет заголовок для <figure> элемента |
| <figure> | Определяет автономное содержание, как иллюстрации, диаграммы, фотографии, списки кодов и т.д. |
| <footer> | Определяет нижний колонтитул документа или раздела |
| <header> | Определяет заголовок для документа или раздел |
| <main> | Определяет основное содержание документа |
| <mark> | Определяет маркированы или выделенный текст |
| <menuitem> | Определяет элемент команды / меню, пользователь может вызвать из контекстного меню |
| <meter> | Определяет измерение скалярного в пределах известного диапазона (a gauge) |
| <nav> | Определяет навигационные ссылки в документе |
| <progress> | Определяет ход выполнения задачи |
| <rp> | Определяет , что показать в браузерах , которые не поддерживают ruby аннотаций |
| <rt> | Определяет объяснение / произношение символов (для Восточной Азии книгопечатания) |
| <ruby> | Определяет ruby аннотацию (for East Asian typography) |
| <section> | Определяет раздел в документе |
| <summary> | Определяет видимый заголовок для <details> элемента |
| <time> | Определяет дату / время |
| <wbr> | Определяет возможный разрыв строки |
Подробнее о HTML5 семантике .
Новая форма элементов
| Тег | Описание |
|---|---|
| <datalist> | Определяет заранее определенные параметры для элементов управления вводом |
| <keygen> | Определяет поле пары ключей генератора (for forms) |
| <output> | Определяет результат расчета |
Прочитайте все о старых и новых форм элементов в HTML - формы элементов .
Типы ввода новых
| Типы ввода новых | Новые атрибуты ввода |
|---|---|
|
|
Узнайте все о старых и новых типов ввода в ввода типов HTML .
Узнайте все о входных атрибутов в Атрибуты HTML ввода .
HTML5 - Новый Атрибут Синтаксис
HTML5 позволяет четыре различных синтаксиса для атрибутов.
Этот пример демонстрирует различные синтаксисов , используемые в <input> тега:
| Тип | пример |
|---|---|
| пустой | <input type="text" value="John" disabled > |
| Некотируемые | <input type="text" value=John > |
| Дважды цитируемый | <input type="text" value="John Doe" > |
| Одно цитируемое | <input type="text" value='John Doe' > |
В HTML5, могут быть использованы все четыре Синтаксисы, в зависимости от того, что необходимо для этого атрибута.
HTML5 Графика
| Тег | Описание |
|---|---|
| <canvas> | Определяет графический рисунок с помощью JavaScript |
| <svg> | Определяет графический рисунок с помощью SVG |
Подробнее о HTML5 Canvas .
Подробнее о HTML5 SVG .
Новые элементы медиа
| Тег | Описание |
|---|---|
| <audio> | Определяет звук или музыкальный контент |
| <embed> | Определяет контейнеры для внешних приложений (like plug-ins) , (like plug-ins) |
| <source> | Определяет источники <video> и <audio> |
| <track> | Определяет треки <video> и <audio> |
| <video> | Определяет видео или кино содержания |
Подробнее о HTML5 видео .
Подробнее о HTML5 Audio .