HTML HTML5 XHTML ПРИМЕРЫ СПРАВОЧНИК РЕКЛАМА ГОСТЕВАЯ

Урок 2 Новые Элементы HTML5


« Назад Далее »

Новые Элементы в HTML5

Интернет значительно изменился с момента появления стандарта HTML 4.01 в 1999.

Сегодня некоторые элементы HTML 4.01 являются устаревшими, никогда не используются, или используются не по назначению. Эти элементы удалены или исправлены в HTML5.

Чтобы лучшим образом обрабатывать сегодняшние интернет потребности, HTML5 также включает новые элементы для улучшения структуры, рисования, медиа контента, и обработки форм.


Новые Элементы Разметки

Новые элементы для улучшения структуры:

Тег Описание
<article> (статья) Определяет независимый, самодостаточный контент: это может быть новостная статья, пост блога, форума или другие статьи, которые могут распространяться независимо от остального содержимого сайта
<aside> (отступление) Для контента - отступления от темы, в которой он размещен. Отступление должно быть связано с окружающим контентом
<command> (команда) Кнопка, или переключатель (радио кнопка), или флажок
<details> (детали) Для описания подробностей документа или частей документа
<summary> (резюме) Заголовок (краткое содержание, резюме) внутри элемента details
<figure> (иллюстрация, рисунок) Для группировки отдельно стоящего содержимого, может быть видео
<figcaption> (заголовок) Заголовок раздела иллюстрации, рисунка, схемы и т.п.
<footer> (нижний колонтитул, подвал) Для создания нижнего колонтитула документа или раздела, может включать, например, имя автора, число, когда документ был опубликован, контактную информацию, информацию об авторском праве
<header> (заголовок) Для создания вступительной части документа или раздела, может включать панель навигации
<hgroup> Для группы заголовков с использованием <h1> - <h6>, где наибольший - это главный заголовок раздела, а остальные - это подзаголовки
<mark> Для текста, который необходимо выделить
<meter> Для измерения, используется только если максимальное и минимальное значения известны
<nav> Для панели навигации
<progress> Прогресс состояния работы
<ruby> Для аннотации агатом (агат - от англ. ruby - типографский шрифт, кегль которого равен 5,5 пунктам, используется для уточнения чтения иероглифов в китайском и японском языке)
<rt> Для объяснения ruby-комментария
<rp> Что показывать браузерам, которые не поддерживают элемент ruby
<section> Для раздела (колонки, рубрики) в документе. Используется для создания глав, заголовков, нижних колонитулов или других разделов документа
<time> (время) Для определения времени или даты, или того и другого
<wbr> Разделени слов. Для определения возможности разделения слова с целью переноса на другую строку посредством дефиса.


Новые Медиа Элементы

HTML5 обеспечивает новый стандарт для медиа содержимого:

Тег Описание
<audio> (аудио) Для мультимедийного контента, звуков, музыки или других аудио потоков
<video> Для видео контента, например, фильмов, клипов или других видео потоков
<source> Медиа источники ресурсов, определенных в аудио или видео элементах
<embed> Для встроенного контента, например плагинов


Элемент Холст

Элемент canvas (холст) испольpует JavaScript для создания рисунков на веб странице.

Тег Описание
<canvas> Для создания графики с помощью скрипта


Новые Элементы Формы

HTML5 предлагает новые элементы формы с дополнительной функциональностью:

Тег Описание
<datalist> Список опций для вводимых значений
<keygen> Генерация ключей для аутентификации пользователей
<output> Для различных типов вывода, таких как вывод, написанный скриптом

Новые Типы Значений Атрибутов Элементов Ввода

Также атрибут type элемента input имеет новые значения - для улучшенного контроля перед отправкой введенных данных на обработку:

Тип Описание
tel Вводимое значение представляет телефонный номер
search Поле ввода является поисковым полем
url Вводимое значение - это адрес URL
email Вводимое значение - один или несколько адресов email
datetime Вводимое значение представляет дату и/или время
date Ввод даты
month Ввод месяца
week Ввод недели
time Ввод времени
datetime-local Вводимое значение - это местные дата/время
number Ввод числового значения
range Ввод числа в заданном диапазоне
color Ввод цвета в шестнадцатеричном формате, например #FF7700





« Назад Далее »
© 2011-2017 Уроки HTML
Рейтинг@Mail.ru