HTML教程 HTML教程HTML是什么HTML 代码编辑器HTML 基础标签HTML 元素HTML 属性HTML 标题HTML 段落HTML 文本格式化HTML CSSHTML 头部HTML链接HTML 图像HTML 区块和行内元素HTML 表格HTML 列表HTML 引用和定义元素HTML 计算机代码元素HTML 布局HTML 框架HTML 脚本/JavaScriptHTML 文件路径HTML 颜色HTML 字符(编码)和实体HTML URL(网址)HTML XHTMLHTML - Web服务器HTML表单 HTML 表单HTML 表单属性HTML 表单元素HTML 表单input类型HTML 表单input属性

HTML 表单input类型

本章节介绍html 表单<input>输入类型,更详细请参考 HTML <input>标签 type属性

type=text案例

本案例定义了两个输入字段,一个提交按钮

<input type="text" name="xing" value="张">
<input type="text" name="ming" value="三">

运行代码

type=hidden案例

设置隐藏字段

本案例设置一个隐藏字段

名字: <input type="hidden" name="ming" value="三"><br>

运行代码

type=password案例

密码字段

设置一个密码字段,在输入密码时会用小黑点显示

密码:<input type="password" name="ming">

运行代码

type=checkbox案例

设置三个多选框

表单多选

<input type="checkbox" name="ming" value="PHP"> PHP教程<br>
  <input type="checkbox" name="ming" value="HTML"> HTML教程<br>
  <input type="checkbox" name="ming" value="CSS"> CSS教程<br>

运行代码

type=image案例

设置图像按钮

图像按钮

<input type="image" src="/Template/Test/img/778.png" alt="Submit" width="50" height="49">

运行代码

type=radio案例

设置单选

表单单选

<input type="radio" name="ming" value="女"/>女
     <input type="radio" name="ming" value="男"/>男

运行代码

type=reset案例

设置重置按钮

重置

<input type="reset" value="重置">

运行代码

type=submit案例

设置提交按钮

gaitubao_微信图片_20210929113416 (1).png

<input type="submit" value="提交">

运行代码

HTML5 输入类型

HTML5 增加了多个新的输入类型: