html表单使用

1、一般的用户名、密码实现：

<form action="reg_success.html" method="post">
<p>
<label for="name">用户名：</label>
<input type="text" value="jack" maxlength="6" size="10" id="name" name="name" readonly/>
</p>
<p>
<label for="pwd">密码：</label>
<input type="password" id="pwd" name="pwd" />
</p>

2、单选框的实现：

<p>
<label for="sex">性别：</label>
<input type="radio" name="sex" id="sex" value="M" checked/>男
<input type="radio" name="sex" id="sex" value="F"/>女
</p>

注：此处使用checked属性是为了默认选择性别为 男。

3、复选框的使用：

（A）显示所有选项的复选框：<p>
<label for="hobby">爱好：</label>
<input type="checkbox" name="hobby" id="hobby" checked value="Movie"/>看电影
<input type="checkbox" name="hobby" id="hobby" value="Music"/>听音乐
<input type="checkbox" name="hobby" id="hobby" value="Sport"/>运动
</p>

（B）下拉菜单选项的复选框：

<p>
<label for="grade">所在年级:</label>
<select multiple="multiple" size="3" id="grade" name="grade">注：此处的size值为显示到页面上的元素值
<option value="1">百杰1部</option>
<option value="2">百杰2部</option>
<option value="3" selected>百杰3部</option>
</select>
</p>

4、使用头像（上传头像）：

<p>
<label for="head">头像:</label>
<input type="file" id="head" name="head" />
</p>

5、常用按钮：

<p>
<input type="submit" value="注册" />
<input type="reset" value="重置" />
<input type="button" value="普通按钮" />
<input type="image" src="images/btn.jpg" />
</p>

6、常用的表单元素

文本框

单行文本type=text

密码框 type=password

多行文本<textarea>

按钮

提交按钮 type=submit

重置按钮 type=reset

普通按钮 type=button

图片按钮 type=image

复选框 type=checkbox

单选框 type=radio

下拉框 <select>

文件域 type=file

隐藏域 type=hidden