HTML <input>标签（<input>标签）- HTML - 软晨网（RuanChen.com）

当前位置: 首页 > 网络学院 > 网页制作基础教程 > HTML > HTML <input>标签

学院文章搜索

关键字

HTML <input>标签

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-03-04 浏览: 768 ::

收藏到网摘: n/a

定义与用法

The <input> tag defines the start of an input field where the user can enter data.
<input>标签可以为用户定义一个可提供输入数据的区域

在HTML和XHTML中的区别

In HTML the <input> tag has no end tag.
在HTML中<input>标签不需要结束标签

In XHTML the <input> tag must be properly closed.
在XHTML中<input>标签必须合理关闭

提示与注意点

Note: The input element is empty, it contains attributes only.
注意：input为空元素，它只包含属性

Tip: Use the label element to define a label to a form control.
提示：使用lable元素来为表单定义一块标签

实例

代码	输出结果
<form action="form_action.asp" method="get"> First name: <input type="text" name="fname" value="Mickey" /> <br /> Last name: <input type="text" name="lname" value="Mouse" /> <br /> <input type="submit" value="Submit" /> </form> <p> If you click the "Submit" button, you will send your input to a new page called form_action.asp.<br /> 按下"Submit"就会将你输入的信息发送到名为form_action.asp的页面上 </p>	First name: Last name: If you click the "Submit" button, you will send your input to a new page called form_action.asp. 按下"Submit"就会将你输入的信息发送到名为form_action.asp的页面上

代码

输出结果

<form action="form_action.asp"
method="get">

First name:
<input type="text" name="fname" value="Mickey" />
<br />
Last name:
<input type="text" name="lname" value="Mouse" />
<br />
<input type="submit" value="Submit" />

</form>

<p>
If you click the "Submit" button, you will send your input to a new page called form_action.asp.<br />
按下"Submit"就会将你输入的信息发送到名为form_action.asp的页面上
</p>

If you click the "Submit" button, you will send your input to a new page called form_action.asp.
按下"Submit"就会将你输入的信息发送到名为form_action.asp的页面上

可选属性

DTD indicates in which DTD the attribute is allowed. S=Strict, T=Transitional, and F=Frameset.
下表中的DTD列指明了被支持的DTD属性。S=Strict（精确的），T=Transitional（传统的），F=Frameset（框架）

属性	值	描述	DTD
accept	list_of_mime_types	A comma-separated list of MIME types that indicates the MIME type of the file transfer. 以逗号分隔MIME类型列 Note: Only used with type="file" 注意：只能在type="file"的时候使用	STF
align	left right top texttop middle absmiddle baseline bottom absbottom	Defines the alignment of text following the image. 定义图片文字的对齐 Note: Only used with type="image" 注意：只能在type=''image"的时候使用	TF
alt	text	Defines an alternate text for the image. 定义针对图片的替换文字 Note: Only used with type="image" 注意：只能在type=''image"的时候使用	STF
checked	checked	Indicates that the input element should be checked when it first loads. 当第一次加载的时候input元素是否为选中状态 Note: Used with type="checkbox" and type="radio" 注意：只能在type="checkbox"以及type="radio"的时候使用	STF
disabled	disabled	Disables the input element when it first loads so that the user can not write text in it, or select it. 在第一次加载的时候让input变为不可用状态。 Note: Cannot be used with type="hidden" 注意：不要在type="hidden"的情况下使用	STF
maxlength	number	Defines the maximum number of characters allowed in a text field. 定义文字输入框内所允许输入的最大限度的字符数 Note: Only used with type="text" 注意：只有type="text"时才可使用	STF
name	field_name	Defines a unique name for the input element. 为input元素定义唯一的name Note: This attribute is required with type="button", type="checkbox", type="file", type="hidden", type="image", type="password", type="text", and type="radio" 注意：对于ype="button", type="checkbox", type="file", type="hidden", type="image", type="password", type="text", 以及 type="radio"的元素来说这个属性是必要的。	STF
readonly	readonly	Indicates that the value of this field cannot be modified. 可以让其中的值变为只读(不能做修改) Note: Only used with type="text" 注意：只能type="text"的时候使用	STF
size	number_of_char	Defines the size of the input element. 定义input元素的大小 Note: Cannot be used with type="hidden" 注意：不能在type="hidden"的时候使用(无效果)	STF
src	URL	Defines the URL of the image to display. 定义要显示图片的URL Note: Only used with type="image" 注意：只有type="image"的时候使用	STF
type	button checkbox file hidden image password radio reset submit text	Indicates the type of the input element. The default value is "text" 指明input元素的类型。默认值为"text" Note: This is not a required attribute, but we think you should include it. If omitted, IE 5.5 will still display a text field, but Netscape 4.7 will not. 注意：这并不是必要的属性。但还是应该加上它，因为每个浏览器的默认值不同	STF
value	value	For buttons, reset buttons and submit buttons: Defines the text on the button. 对于buttons, reset buttons 以及 submit buttons来说：定义按钮的文字 For image buttons: Defines the symbolic result of the field passed to a script. 对于image按钮来说：定义的值为传送给脚本的结果 For checkboxes and radio buttons: Defines the result of the input element when clicked. The result is sent to the form's action URL. 对于checkboxes和radio buttons来说：定义的为选中后所代表的结果，该结果会发送动表单action所指定的URL上 For hidden, password, and text fields: Defines the default value of the element. 对于hidden,password以及text fields来说：是为元素定义默认值 Note: Cannot be used with type="file" 注意：请不要在type="file"的时候使用 Note: This attribute is required with type="checkbox" and type="radio" 注意：对于type="checkbox"和type="radio"来说这是个必要属性	STF

标准属性

id, class, title, style, dir, lang, xml:lang

For a full description, go to Standard Attributes.
查看完整的属性

事件属性

tabindex, accesskey, onfocus, onblur, onselect, onchange, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

For a full description, go to Event Attributes.
查看完整的属性

尝试与演示

Text fields
How to create text fields on an HTML page. A user can write text in a text field.
如何在HTML里建立文字输入框。用户可以在里面写文字

Password fields
How to create a password field on an HTML page.
如何在HTML页面里建立密码输入框

Checkboxes
How to create check-boxes on an HTML page. A user can select or unselect a checkbox.
如何在HTML页面里建立复选框。用户可以选择或不选择

Radiobuttons
How to create radio-buttons on an HTML page.
如何在HTML中建立单选按钮

Create a button
How to create a button. On the button you can define your own text.
如何建立按钮。按钮的文字可以自己定义

Form with input fields and a submit button
How to add a form to a page. The form contains two input fields and a submit button.
怎样为页面加上一个表单。里面包括两个输入框和一个提交按钮

Form with checkboxes
This form contains two checkboxes, and a submit button.
这个表单里有两个复选框，以及一个提交按钮

Form with radiobuttons
This form contains two radio buttons, and a submit button.
这个表单包含两个单选按钮，以及一个提交按钮