`

HTML <input> 标签的 type 属性

阅读更多

http://www.w3school.com.cn/tags/att_input_type.asp

 

定义和用法

type 属性规定 input 元素的类型。

实例

下面的表单拥有两个输入字段以及一个提交按钮:

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit"
 value="Submit" />
</form>

亲自试一试 (您在页面下面可以找到更多例子)

语法

<input type="value
">

属性值

值 描述
button 定义可点击按钮(多数情况下,用于通过 JavaScript 启动脚本)。
checkbox 定义复选框。
file 定义输入字段和 "浏览"按钮,供文件上传。
hidden 定义隐藏的输入字段。
image 定义图像形式的提交按钮。
password 定义密码字段。该字段中的字符被掩码。
radio 定义单选按钮。
reset 定义重置按钮。重置按钮会清除表单中的所有数据。
submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
text 定义单行的输入字段,用户可在其中输入文本。默认宽度为 20 个字符。

Text

<input type="text" /> 定义用户可输入文本的单行输入字段。

Email: <input type="text" name="email" />
Pin: <input type="text" name="pin" />

TIY

Button

<input type="button" /> 定义可点击的按钮,但没有任何行为。button 类型常用于在用户点击按钮时启动 JavaScript 程序。

<input type="button" value="Click me" onclick="msg()" />

TIY

Checkbox

<input type="checkbox" /> 定义复选框。复选框允许用户在一定数目的选择中选取一个或多个选项。

<input type="checkbox" name="vehicle" value="Bike" /> I have a bike
<input type="checkbox" name="vehicle" value="Car" /> I have a car

TIY

File

<input type="file" /> 用于文件上传。

<input type="file" />

TIY

Hidden

<input type="hidden" /> 定义隐藏字段。隐藏字段对于用户是不可见的。隐藏字段通常会存储一个默认值,它们的值也可以由 JavaScript 进行修改。

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

TIY

Image

<input type="image" /> 定义图像形式的提交按钮。

必须把 src 属性alt 属性 与 <input type="image"> 结合使用。

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

TIY

Password

<input type="password" /> 定义密码字段。密码字段中的字符会被掩码(显示为星号或原点)。

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

TIY

Radio

<input type="radio" /> 定义单选按钮。单选按钮允许用户选取给定数目的选择中的一个选项。

<input type="radio" name="sex" value="male" /> Male
<input type="radio" name="sex" value="female" /> Female

TIY

Reset Button

<input type="reset" /> 定义重置按钮。重置按钮会清除表单中的所有数据。

<input type="reset" />

TIY

Submit

<input type="submit" /> 定义提交按钮。提交按钮用于向服务器发送表单数据。数据会发送到表单的 action 属性中指定的页面。

<form action="form_action.asp" method="get">
Email: <input type="text" name="email" />
<input type="submit" />
</form>
分享到:
评论

相关推荐

    HTML标签属性大全

    表单标签是指在HTML文档中用于定义表单的标签,包括&lt;form&gt;、&lt;input&gt;、&lt;textarea&gt;等标签。 &lt;form&gt;标签用于定义表单。&lt;input&gt;标签用于定义输入控件。&lt;textarea&gt;标签用于定义多行文本输入控件。 七、框架标签 框架...

    HTML标签(下)(表格+列表+表单)

    input标签有多种类型,例如text、password、checkbox、radio等。例如: ``` &lt;input type="text" name="username" /&gt; ``` &lt;select&gt;标签 &lt;select&gt;标签用于定义表单中的下拉列表。例如: ``` &lt;select&gt; &lt;option&gt;选项1...

    HTML常用标签.pdf

    29. &lt;input&gt;:&lt;input&gt; 标签用于搜集用户信息。根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。 30. &lt;select&gt;:&lt;select&gt; 元素可创建单选...

    HTML标签大全简介

    例如:&lt;input&gt; 标签用于创建文本输入框:&lt;input type="text" name="username" /&gt;。此外,还有 &lt;textarea&gt; 标签用于创建多行文本框、&lt;select&gt; 标签用于创建下拉菜单、&lt;button&gt; 标签用于创建按钮等。 表格标签 HTML ...

    爱淘课html网页属性.pdf

    1. &lt;html&gt;、&lt;head&gt;、&lt;title&gt;、&lt;body&gt;标签:这些标签是HTML文档的基础结构标签。html标签是所有HTML页面的根元素。head标签内通常包含文档的元数据,如标题&lt;title&gt;。body标签用于包含网页的所有可见内容。 2. &lt;img&gt;...

    HTML标签分类及其属性.pdf

    “&lt;formid=form1&gt;&lt;/legend&gt;&lt;inputtype=checkbox&gt;HTML&lt;br&gt;&lt;inputtype=checkbox&gt;CSS&lt;br&gt;&lt;inputtype=checkbox&gt;DHTML&lt;br&gt;&lt;inputtype=checkbox&gt;SCRIPT&lt;br&gt;&lt;/form&gt;&lt;/fieldset&gt;”这段文字可能包含错误,正确的应该是关于...

    HTML标签解释大全

    &lt;input type="text" id="fname" name="fname"&gt;&lt;br&gt; &lt;/fieldset&gt; ``` ##### 标签:font - **说明**:`&lt;font&gt;` 标签用于指定用于渲染所包含文本的新字体、大小和颜色,但该标签已经被废弃。例如: ```html &lt;font...

    网页制作基本标签.pdf

    交互元素是网页的重要组成部分,&lt;form&gt;标签用于创建用户输入表单,表单中的输入元素由&lt;input&gt;标签定义,包括文本输入框(type="text")、密码输入框(type="password")、提交按钮(type="submit")等。对于选择框,...

    html基础实例

    表单提交通过&lt;button&gt;或&lt;input type="submit"&gt;实现,而&lt;form action&gt;和&lt;form method&gt;分别定义了表单数据提交的URL和方式(GET或POST)。 HTML5引入了许多新特性,例如语义化标签如&lt;header&gt;、&lt;footer&gt;、&lt;nav&gt;、...

    Html中文完全参考手册

    3. **属性**:HTML标签可以有属性,比如&lt;a&gt;标签的href属性定义链接地址,img标签的src属性指定图片源,&lt;input&gt;标签的type属性决定输入类型(如文本、密码、复选框等)。 4. **CSS集成**:HTML可以通过&lt;style&gt;标签在...

    青鸟S1HTMl项目

    - 链接:&lt;a&gt;标签创建超链接,href属性指定链接的目标地址,target属性可设置链接打开的方式(如新窗口或当前窗口)。 - 图像:&lt;img&gt;标签插入图片,src属性指定图像源,alt属性提供替代文字,有助于无障碍访问。 3...

    .NET实验报告

    这些标签都有各自的属性,例如&lt;input&gt;的name属性用于标识输入域,type属性设定输入类型,&lt;select&gt;的size属性定义显示的行数,multiple属性允许多选,&lt;option&gt;的selected属性用于设置默认选中的选项。 在实验中,...

    HTML5 标准.docx

    HTML5 中的一些标签属性更新,如&lt;input&gt;标签的type属性增加了更多的选项,&lt;video&gt;和&lt;audio&gt;标签的controls属性用于添加播放控件,&lt;img&gt;标签的srcset属性用于适配不同设备的分辨率。 9. 事件属性 HTML5 提供了更多的...

    头歌教学实践平台 Web前端开发基础 HTML-表单类的标签

    `&lt;form&gt;`标签通过`action`属性指定提交数据的URL,`method`属性设置数据传输方式,如GET或POST。 示例: ```html &lt;form action="submit.php" method="post"&gt; &lt;!-- 表单内容 --&gt; &lt;/form&gt; ``` 2. `&lt;input&gt;`...

    机试 (HTML)

    HTML提供了一系列标签来控制文本格式,如&lt;b&gt;加粗文本&lt;/b&gt;、&lt;i&gt;斜体文本&lt;/i&gt;、&lt;u&gt;下划线文本&lt;/u&gt;、&lt;strong&gt;强调文本&lt;/strong&gt;、&lt;em&gt;着重文本&lt;/em&gt;等。此外,&lt;br&gt;用于换行,&lt;p&gt;定义段落,&lt;h1&gt;至&lt;h6&gt;表示不同级别的标题...

    网页-分知识点简单练习(html)

    &lt;input type="text" id="username" name="username"&gt;&lt;br&gt; &lt;input type="submit" value="提交"&gt; &lt;/form&gt; ``` 10. CSS样式:虽然不是HTML,但CSS(Cascading Style Sheets)用于美化HTML页面。可以使用&lt;style&gt;...

    2020html基础笔记

    HTML元素可以有属性,例如&lt;a&gt;标签的href属性指定链接地址,&lt;img&gt;标签的src属性指定图片源,alt属性提供替代文本,&lt;input&gt;标签的type属性定义输入字段类型,如文本、密码、提交按钮等。 4. CSS样式: 虽然不是HTML...

    input 标签的属性

    本文将详细介绍`&lt;input&gt;`标签的各种类型及其相关属性,并通过示例帮助理解这些属性的作用。 #### 二、常见类型与属性 ##### 1. `type="text"` - 文本输入框 文本输入框是最基本的一种输入类型,主要用于收集用户的...

    HTML常用标签和属性PPT

    例如,`&lt;a&gt;`标签的`href`属性定义了链接的目标地址,`&lt;img&gt;`标签的`src`属性指定了图像文件的位置,`&lt;input&gt;`标签的`type`属性决定了输入框的类型(如文本、密码、复选框等)。属性通常以键值对的形式出现,如`name=...

    一些简单的HTML代码

    &lt;img&gt;标签插入图像,需指定src属性为图片源地址;&lt;br&gt;用于换行,&lt;hr&gt;创建水平分隔线。 HTML还支持表单元素,如&lt;form&gt;、&lt;input&gt;、&lt;textarea&gt;、&lt;select&gt;和&lt;option&gt;,用于创建用户交互的表单,常用于收集用户信息。...

Global site tag (gtag.js) - Google Analytics