HTML `<input>` 标签

说明

<input> 标签用于在表单中创建交互式控件。

<input> 元素的显示方式可能会有所不同以及它使用或需要的属性取决于指定的 type 属性。

下表总结了此标签的使用上下文和版本历史。

Placement:	Inline
Content:	None. 它是一个empty 空元素。
开始/结束标签：	开始标签： required, 结束标签：forbidden
版本：	HTML 2, 3.2, 4, 4.01, 5

语法

<input> 标签的基本语法如下：

HTML:<input>; XHTML:<input />

下面的示例显示了 <input> 标签的作用。

示例

Try this code »

<form action="action.asp" method="post">
    <label for="first-name">First name:</label>
    <input type="text" name="first-name" id="first-name">
    <input type="submit" value="Submit">
    <input type="reset" name="Reset">
</form>

提示：使用 HTML <label> 元素定义输入控件的标签。它将使用户更容易访问表单。

标签特定属性

下表显示了特定于 <input> 标签的属性。

属性	值	说明
`type`	`button checkbox color date datetime datetime-local email file hidden image month number password radio range reset search submit tel text time url week`	指定要创建的控件类型。请参阅 HTML 表单、HTML5 新输入类型上的教程以了解有关输入控件的更多信息。
`accept`	file-extension content-type `audio/* video/* image/*`	指定服务器接受的文件类型（仅适用于 `type="file"`）。
`align`	`left right top middle bottom`	Obsolete 指定图像输入的对齐方式（对于 `type="image"`）。
`alt`	text	指定当图像不可用时使用的替代文本（对于 `type="image"`）。
`autocomplete`	`on off`	指定输入元素的浏览器自动填充功能是打开还是关闭。
`autofocus`	`autofocus`	此布尔属性指定输入元素应在加载文档时自动获得焦点。
`checked`	`checked`	此布尔属性指定默认选择控件（对于 `type="radio"` 或 `type="checkbox"`）。
`disabled`	`disabled`	此布尔属性禁用用户输入或交互的控件。
`form`	form-id	指定与输入元素关联的 `<form>` 元素（其表单所有者）。
`formaction`	URL	指定处理输入提交的信息的程序的 URL（对于 `type="submit"` 和 `type="image"`）。
`formenctype`	`application/x-www-form-urlencoded multipart/form-data text/plain`	指定向服务器提交表单数据时应如何编码表单数据（对于 `type="submit"` 和 `type="image"`）。
`formmethod`	`get post`	指定浏览器用来提交表单数据的 HTTP 方法（对于 `type="submit"` 和 `type="image"`）。
`formnovalidate`	`formnovalidate`	此布尔属性指定表单控件在提交时不应被验证（对于 `type="submit"` 和 `type="image"`）。
`formtarget`	`_blank _self _parent _top` framename	指定一个目标来显示提交表单后收到的响应（对于 `type="submit"` 和 `type="image"`）
`height`	pixels	指定显示为按钮的图像的高度（仅适用于 `type="image"`）。
`list`	datalist-id	指建议给用户的预定义选项列表。该值必须是同一页面中 `<datalist>` 元素的 `id`。
`max`	number date-time	指定输入控件的最大值，该最大值不得小于其最小值（`min` 属性）值。
`maxlength`	number	指定用户可以在输入框中输入的最大字符数。
`min`	number date-time	指定输入控件的最小值，该最小值不得大于其最大值（`max` 属性）值。
`minlength`	number	指定用户应在输入框中输入的最少字符数。
`multiple`	`multiple`	此布尔属性指示用户是否可以输入多个值。
`name`	text	为输入控件分配名称。
`pattern`	regexp	指定检查输入元素值的正则表达式。
`placeholder`	text	向用户提供可以在输入控件中输入的内容的提示。占位符文本不得包含换行符。
`readonly`	`readonly`	该布尔属性表示用户不能修改控件的值。
`required`	`required`	此布尔属性指定用户必须在提交表单之前填写一个值。
`size`	number	设置输入控件的初始宽度（以字符为单位）。如果未指定，则使用默认值 `20`。
`src`	URL	指定用作提交按钮的图像的位置（对于 `type="image"`）。
`step`	number date-time	使用 `min` 和 `max` 属性来限制可以设置数字或日期时间值的增量。
`value`	text	指定输入控件的初始值。
`width`	pixels	指定显示为按钮的图像宽度（仅适用于 `type="image"`）。

全局属性

与所有其他 HTML 标签一样， <input> 标签支持 HTML5 中的全局属性。

事件属性

<input> 标签还支持 HTML5 中的事件属性。

浏览器兼容性

所有主要的现代浏览器都支持 <input> 标签。

基本支持—

Firefox 1+
Google Chrome 1+
Internet Explorer 2+
Apple Safari 1+
Opera 2.1+

进一步阅读

请参阅以下教程： HTML 表单.

其他与表单相关的标签： <fieldset>, <legend>, <label>, <form>, <textarea>, <select>, <optgroup>, <option>, <button>.

HTML <input> 标签

说明

语法

示例