html表单input六种属性以及演示

1.html的input type各类属性和概述

属性	概述
text	定义供文本输入的单行输入字段
number	定义数字
password	定义密码字段
button	定义按钮
radio	定义单选按钮
checkbox	定义多选框

2.input代码演示

1.text文本

one name:<br>
<input type="text" name="onename">
<br>
two name:<br>
<input type="text" name="twoname">
<!-- br换行 -->

2.number数字

<label for="a">Number(0-100):</label>
<!-- min最小值，max最大值 -->
<input type="number" id="a" name="a" min="0" max="100" />

3.password密码

<div>
  <label for="name">name</label>
  <input type="text" id="name" name="name" />
</div>
<div>
  <label for="pass">Password (8 characters minimum):</label>
  <input type="password" id="pass" name="password" minlength="8" />
</div>

<input type="submit" value="a" />
<!-- submit提交 -->

4.button按钮

<input type="button" value="按钮" />

5.radio单选

<input type="radio" name="sex" value="male" checked><!-- 第一个选择 -->
<br>
<input type="radio" name="sex" value="female"><!-- 第二个选择 -->

6.checkbox多选

  <div>
    <input type="checkbox" id="a" name="a" checked />
    <label for="a">chooseone</label>
  </div>
  <div>
    <input type="checkbox" id="b" name="b" />
    <label for="b">choosetwo</label>
  </div>