Latest web development tutorials
×

HTML этикетка

HTML список Теги(в алфавитном порядке) HTML список Теги(функция сортировки) HTML Глобальные свойства HTML событие HTML холст HTML Аудио / Видео HTML эффективный DOCTYPES HTML название цвета HTML Выбор цвета HTML Комбинируйте цвета HTML Набор символов HTML ASCII HTML ISO-8859-1 HTML символ HTML URL кодирование HTML таблица условных сигналов HTTP новости HTTP способ Px/Em Инструменты преобразования Сочетания клавиш

HTML этикетка

<!--> <!DOCTYPE> <a> <abbr> <acronym> <address> <applet> <area> <article> <aside> <audio> <b> <base> <basefont> <bdi> <bdo> <big> <blockquote> <body> <br> <button> <canvas> <caption> <center> <cite> <code> <col> <colgroup> <command> <datalist> <dd> <del> <details> <dfn> <dialog> <dir> <div> <dl> <dt> <em> <embed> <fieldset> <figcaption> <figure> <font> <footer> <form> <frame> <frameset> <head> <header> <hgroup> <h1> - <h6> <hr> <i> <iframe> <img> <input> <ins> <kbd> <keygen> <label> <legend> <li> <link> <map> <mark> <menu> <meta> <meter> <nav> <noframes> <noscript> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <html> <progress> <q> <rp> <rt> <ruby> <s> <samp> <script> <section> <select> <small> <source> <span> <strike> <strong> <style> <sub> <summary> <sup> <table> <tbody> <td> <textarea> <tfoot> <th> <thead> <time> <title> <tr> <track> <tt> <u> <ul> <var> <video> <wbr>

атрибуты ввода типа HTML

HTML ввода тегов Ссылка HTML <вход> Тег

примеров

HTML форма с двумя различными типами ввода, текст и представить:

<form action="demo-form.php">
用户名: <input type="text" name="usrname"><br>
<input type="submit" value="提交">

Попробуйте »
(См внизу этой страницы для большего количества примеров)

Поддержка браузеров

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Все основные браузеры поддерживают атрибут типа. Тем не менее, не все основные браузеры поддерживают все различные типы входов могут работать во всех основных браузерах.

Ниже для каждого типа входного сигнала поддержки браузера.


Определение и использование

<Input> Атрибут типа определяет тип элемента, который вы хотите отобразить.

По умолчанию используется тип: текст.

Примечание: Этот атрибут не является обязательным, но мы думаем , что вы всегда должны использовать его.


Различия между HTML 4.01 и HTML5

Следующие типы входов являются новыми типа HTML5: цвет, дата, даты и времени, даты и времени-местный, месяц, неделя, время, адрес электронной почты, номер, диапазон, поиск, тел и URL.


грамматика

<input type="value">

Значение свойства

描述
button 定义可点击的按钮(通常与 JavaScript 一起使用来启动脚本)。
checkbox 定义复选框。
color New 定义拾色器。
date New 定义 date 控件(包括年、月、日,不包括时间)。
datetime New 定义 date 和 time 控件(包括年、月、日、时、分、秒、几分之一秒,基于 UTC 时区)。
datetime-local New 定义 date 和 time 控件(包括年、月、日、时、分、秒、几分之一秒,不带时区)。
email New 定义用于 e-mail 地址的字段。
file 定义文件选择字段和 "浏览..." 按钮,供文件上传。
hidden 定义隐藏输入字段。
image 定义图像作为提交按钮。
month New 定义 month 和 year 控件(不带时区)。
number New 定义用于输入数字的字段。
password 定义密码字段(字段中的字符会被遮蔽)。
radio 定义单选按钮。
range New 定义用于精确值不重要的输入数字的控件(比如 slider 控件)。
reset 定义重置按钮(重置所有的表单值为默认值)。
search New 定义用于输入搜索字符串的文本字段。
submit 定义提交按钮。
tel New 定义用于输入电话号码的字段。
text 默认。定义一个单行的文本字段(默认宽度为 20 个字符)。
time New 定义用于输入时间的控件(不带时区)。
url New 定义用于输入 URL 的字段。
week New 定义 week 和 year 控件(不带时区)。


примеров

Тип входа: Кнопка

OperaSafariChromeFirefoxInternet Explorer

примеров

Определение интерактивными кнопками, когда пользователь нажимает на кнопку, чтобы начать период JavaScript:

<input type="button" value="点我" onclick="msg()">

Попробуйте »


Тип входа: флажок

OperaSafariChromeFirefoxInternet Explorer

примеров

Box позволяет пользователю выбрать один или несколько вариантов в ряде вариантов:

<input type="checkbox" name="vehicle[]" value="Bike"> 我有一辆自行车<br>
<input type="checkbox" name="vehicle[]" value="Car"> 我有一辆小轿车<br>
<input type="checkbox" name="vehicle[]" value="Boat"> 我有一艘船<br>

Попробуйте »


Тип входа: Цвет

OperaSafariChromeFirefoxInternet Explorer

примеров

Выберите цвет из палитры:

选择你喜欢的颜色: <input type="color" name="favcolor"><br>

Попробуйте »


Тип входа: Дата

OperaSafariChromeFirefoxInternet Explorer

примеров

Задаваемые управления дата:

生日: <input type="date" name="bday">

Попробуйте »


Тип входа: Дата и время

OperaSafariChromeFirefoxInternet Explorer

примеров

Определение даты и времени контроля (с часовым поясом):

生日 (日期和时间): <input type="datetime" name="bdaytime">

Попробуйте »


Тип входа: DateTime-местный

OperaSafariChromeFirefoxInternet Explorer

примеров

Определение даты и времени контроля (без часового пояса):

生日 (日期和时间):<input type="datetime-local" name="bdaytime">

Попробуйте »


Тип входа: электронная почта

OperaSafariChromeFirefoxInternet Explorer

примеров

Определения полей для электронной почты (когда форма передается автоматически к значению поля электронной почты для проверки):

E-mail: <input type="email" name="usremail">

Попробуйте »

Совет: iPhone Safari браузер распознает тип ввода электронной почты, а затем изменить клавиатуры на сенсорном экране , чтобы адаптироваться к нему (добавить @ и .com опции).


Тип ввода: файл

OperaSafariChromeFirefoxInternet Explorer

примеров

Чтобы определить поле выбора файла и кнопку "Обзор ...", для загрузки файла:

选择一个文件: <input type="file" name="img">

Попробуйте »


Тип входа: скрытый

OperaSafariChromeFirefoxInternet Explorer

примеров

Определение скрытых полей, скрытые поля не видны пользователю. Скрытые поля часто хранят значение по умолчанию, или изменить их значения с помощью JavaScript:

<input type="hidden" name="country" value="Norway">

Попробуйте »


Тип входа: Изображение

OperaSafariChromeFirefoxInternet Explorer

примеров

Пользовательские изображения в качестве кнопки отправки:

<input type="image" src="img_submit.gif" alt="Submit">

Попробуйте »


Тип входа: месяц

OperaSafariChromeFirefoxInternet Explorer

примеров

Определить месяц и год управление (без часового пояса):

生日 ( 月和年 ): <input type="month" name="bdaymonth">

Попробуйте »


Тип входа: Номер

OperaSafariChromeFirefoxInternet Explorer

примеров

Введите номер, чтобы определить поля для (вы можете установить допустимый предел числа):

数量 ( 1 到 5 之间): <input type="number" name="quantity" min="1" max="5">

Попробуйте »

Пожалуйста, используйте следующие атрибуты для указания ограничений:

  • MAX - максимально допустимое правилами.
  • мин - минимально допустимый правилами.
  • STEP - требования к правовой цифрового интервала.
  • Значение по - умолчанию , указанный.

Тип входа: пароль

OperaSafariChromeFirefoxInternet Explorer

примеров

Определить поля пароля (поля паролей замаскированные символов):

<input type="password" name="pwd">

Попробуйте »


Тип входа: радио

OperaSafariChromeFirefoxInternet Explorer

примеров

Это позволяет пользователю выбрать опцию в ряде вариантов:

<input type="radio" name="gender" value="male"> Male<br>
<input type="radio" name="gender" value="女"> 女

Попробуйте »


Тип входа: Диапазон

OperaSafariChromeFirefoxInternet Explorer

примеров

Он определяет точное значение не имеет значения цифровой вход управления (например, управления ползунком). Можно также установить лимиты приемлемых номера:

<input type="range" name="points" min="1" max="10">

Попробуйте »

Пожалуйста, используйте следующие атрибуты для указания ограничений:

  • MAX - максимально допустимое правилами.
  • мин - минимально допустимый правилами.
  • STEP - требования к правовой цифрового интервала.
  • Значение по - умолчанию , указанный.

Тип входа: сброс

OperaSafariChromeFirefoxInternet Explorer

примеров

Определить кнопку сброса (сброс всех форма по умолчанию):

<input type="reset">

Попробуйте »

Совет: Будьте осторожны при использовании кнопки сброса!Для пользователей, случайно нажал на кнопку сброса является очень раздражающая вещь.


Тип входа: поиск

OperaSafariChromeFirefoxInternet Explorer

примеров

Определено поле поиска (например, поиск по сайту или поиск Google и т.д.):

Search Google: <input type="search" name="googlesearch">

Попробуйте »


Тип входа: отправить

OperaSafariChromeFirefoxInternet Explorer

примеров

Определить кнопку отправки:

<input type="submit">

Попробуйте »


Тип входа: тел

OperaSafariChromeFirefoxInternet Explorer

примеров

Задаваемые поля для ввода телефонных номеров:

电话号码: <input type="tel" name="usrtel">

Попробуйте »


Тип входа: текст

OperaSafariChromeFirefoxInternet Explorer

примеров

Пользователь может задать два, чтобы ввести одну строку текста в текстовом поле:

First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>

Попробуйте »


Тип входа: Время

OperaSafariChromeFirefoxInternet Explorer

примеров

Введите время определения управления используется (без временной зоны):

选择时间: <input type="time" name="usr_time">

Попробуйте »


Тип входа: URL

OperaSafariChromeFirefoxInternet Explorer

примеров

Определяет поля ввода URL-адрес:

添加你的主页: <input type="url" name="homepage">

Попробуйте »

Совет: iPhone Safari браузер распознает тип ввода URL, а затем изменить сенсорной экранной клавиатуры , чтобы адаптироваться к нему (добавить опцию .com).


Тип входа: неделя

OperaSafariChromeFirefoxInternet Explorer

примеров

Определение недели и контроль года (без часового пояса):

选择周: <input type="week" name="week_year">

Попробуйте »


HTML ввода тегов Ссылка HTML <вход> Тег