input标签

1.input标签

    input标签通常用在表单中，用来定义各种不同的控件类型：text、password、radio、checkbox、submit、reset、button、
    file、image。

1.1 text类型

   text类型用于定义一个输入框，用户可在输入框内自由输入数字内容。

   姓名：<input type = "text" name = "username" value = "请输入用户名"/><br />

1.2 password类型

   password类型用于定义一个密文输入框，输入的内容均不可见，一般用于收集密码等内容。

   密码：<input type = "password"" name = "password" value = "请输入密码"/><br />

1.3 radio类型

   radio类型用于定义一组单选框，即在多种选择间仅能选取一组，通常可用于性别等非此即彼的信息。
   要实现单选，控件类型的name值需要一致。

   性别： 男<input type = "radio" name = "sex" value = "男"/> 女<input type = "radio" name = "sex" value = "女"/><br />

1.4 checkbox类型

   checkbox类型用于定义一组复选框，即同时可选取多组数据，通常可用于爱好等同时有多个选项的信息。
   与radio类型一样，控件类型的name值需要一致。

  爱好：篮球<input type = "checkbox"" name = "爱好" value = "篮球"/> 足球<input type = "checkbox"" name = "爱好" 
  value = "足球"/>

1.4 submit类型

   submit类型用于定义一个提交按钮，点击按钮后，会进行提交表单并跳转到表单指定的页面。

  <input type = "submit" name = "submit" value = "免费注册"/> <br />

1.5 reset类型

   submit类型用于定义一个重置页面按钮，点击按钮后，会将页面重置到刚打开的状态。

   <input type = "reset" name = "reset" value = "重置页面"/> <br />

1.6 button类型

   button类型用于定义一个按钮，通常与js进行交互从而触发相应操作。

  <input type = "button" name = "button" value = "登录"/> <br />

1.6 file类型

   file类型用于定义一个文件域，包含按钮、文件信息，点击按钮后会打开文件选择窗口，选择文件后会显示文件信息。

   <input type = "file" name = "file" value = "上传图片"/> <br />

1.6 image类型

   image类型用于定义一个图片提交按钮，功能与submit类型一致，只是按钮形式为图片。

   <input type = "image" name = "image"  src = "草莓.jpg" value = "图片提交按钮"/> <br />

1.6 hidden类型

   没看懂，后续补充。😟

所有代码：

<form action = "111.php" method = "get">
  姓名：<input type = "text" name = "username" value = "请输入用户名"/><br />
  密码：<input type = "password"" name = "password" value = "请输入密码"/><br />
  性别： 男<input type = "radio" name = "sex" value = "男"/> 
         女<input type = "radio" name = "sex" value = "女"/><br />
  爱好：篮球<input type = "checkbox"" name = "爱好" value = "篮球"/> 
        足球<input type = "checkbox"" name = "爱好" value = "足球"/><br />
  <input type = "submit" name = "submit" value = "免费注册"/> <br />
  <input type = "reset" name = "reset" value = "重置页面"/> <br />
  <input type = "button" name = "button" value = "登录"/> <br />
  <input type = "file" name = "file" value = "上传图片"/> <br />
  <input type = "image" name = "image"  src = "草莓.jpg" value = "图片提交按钮"/> <br />
</form>