Главная »
2012 » Август » 3 » HTML5 новых типов входных
01:05 HTML5 новых типов входных |
HTML5 новых типов входных
HTML5 имеет несколько новых типов входных данных для формы. Эти новые функции позволяют лучше контролировать ввод и проверку.
В данной главе рассматриваются новые типы ввода:
цвет
дата
даты
даты-местный
электронная почта
месяц
номер
диапазон
поиск
телефон
время
URL-адрес
неделя
Примечание: Не все основные браузеры поддерживают все новые типы ввода. Тем не менее, вы уже можете начать использовать их, если они не поддерживаются, они будут вести себя как обычные текстовые поля.
Тип входа: цвет
Цвет тип используется для ввода поля, которые должны содержать цвета.
Пример
Выберите цвет из палитры цветов:
Select your favorite color: <input type="color" name="favcolor" />
Попробуйте сами »
Тип входа: дата
Дата типа позволяет пользователю выбрать дату.
Пример
Определить дату управления:
Birthday: <input type="date" name="bday" />
Попробуйте сами »
Тип входа: даты
Даты типа позволяет пользователю выбрать дату и время (с часовым поясом).
Пример
Определить дату и время контроля (с часовым поясом):
Birthday (date and time): <input type="datetime" name="bdaytime" />
Попробуйте сами »
Тип входа: даты, местные
Даты-местный тип позволяет пользователю выбрать дату и время (часовой пояс).
Пример
Определить дату и время контроля (часовой пояс):
Birthday (date and time): <input type="datetime-local" name="bdaytime" />
Попробуйте сами »
Тип входа: E-mail
Адрес электронной почты типа используются для полей ввода, который должен содержать адрес электронной почты.
Пример
Определить поле для адреса электронной почты (будет автоматически проверяется при печати):
E-mail: <input type="email" name="usremail" />
Попробуйте сами »
Совет: Safari на iPhone распознает тип электронной почты, а также изменения экранной клавиатуры в соответствии с его (добавляет @ и COM порт.).
Тип входа: месяц
Месяц типа позволяет пользователю выбрать месяц и год.
Пример
Определить месяц и год управления (часовой пояс):
Birthday (month and year): <input type="month" name="bdaymonth" />
Попробуйте сами »
Тип входа: число
Тип номера используются для полей ввода, которая должна содержать числовое значение.
Вы также можете установить ограничения на номера принимаются:
Пример
Определите числовое поле (с ограничениями):
Quantity (between 1 and 5): <input type="number" name="quantity" min="1" max="5" />
Попробуйте сами »
Используйте следующие атрибуты, определяющие ограничения:
Макс - определяет максимально допустимое значение
мин - определяет минимальное допустимое значение
шаг - определяет правовые интервалом число
Значение - задает значение по умолчанию
Попробуйте например со всеми атрибутами ограничение: Попробуйте сами
Тип входа: диапазон
Диапазон тип используется для полей ввода, которая должна содержать значение из диапазона чисел.
Вы также можете установить ограничение на то, что номера не принимаются.
Пример
Определить управление для ввода числа, точное значение которого не важна (как ползунка):
<input type="range" name="points" min="1" max="10" />
Попробуйте сами »
Используйте следующие атрибуты, определяющие ограничения:
Макс - определяет максимально допустимое значение
мин - определяет минимальное допустимое значение
шаг - определяет правовые интервалом число
Значение - задает значение по умолчанию
Тип входа: поиск
Тип поиска используется для поиска поля (поле поиска ведет себя как обычный текстовое поле).
Пример
Определить поле поиска (например, поиск по сайту или поиск Google):
Search Google: <input type="search" name="googlesearch" />
Попробуйте сами »
Тип входа: тел
Пример
Определить поле для ввода номера телефона:
Telephone: <input type="tel" name="usrtel" />
Попробуйте сами »
Тип входа: время
Время типа позволяет пользователю выбрать время.
Пример
Определить управление для ввода времени (часовой пояс):
Select a time: <input type="time" name="usr_time" />
Попробуйте сами »
Тип входа: URL
URL типа используются для полей ввода, которая должна содержать URL-адрес.
Значение URL поле автоматически проверяется при отправке формы.
Пример
Определить поле для ввода URL:
Add your homepage: <input type="url" name="homepage" />
Попробуйте сами »
Совет: Safari на iPhone распознает тип URL ввода и изменения экранной клавиатуры в соответствии с его (добавляет ком вариант.).
Тип входа: неделя
На прошлой неделе типа позволяет пользователю выбрать неделю и год.
Пример
Определить в неделю и год управления (часовой пояс):
Select a week: <input type="week" name="week_year" />
Попробуйте сами »
HTML5 тегов <input>
Тег Описание
<input> Определяет входной контроль
|
|
Просмотров: 950 |
Добавил:
| Рейтинг: 0.0/0 |
Добавлять комментарии могут только зарегистрированные пользователи.
[
Регистрация |
Вход ]
