form表单

<form action="form.html" method="get" enctype="multiplepart/form-data">
<!-- 文本框 -->
姓名：<input type="text" name="username" value="请输入姓名" maxlength="20"><br><br>
<!-- 密码框 -->
密码：<input type="password" name="pwd" value=""><br><br>
<textarea name="js" id="js" cols="30" rows="10"></textarea><br><br>
<!-- 单选按钮 -->
性别：<label for="male">男</label> <input type="radio" name="sex" value="男" id="male" >
<label for="mele">女</label> <input type="radio" name="sex" value="女" id="mele" checked><br><br>

<!-- 复选框 -->
爱好：音乐<input type="checkbox" name="love" value="音乐" checked>
看书<input type="checkbox" name="love" value="看书" checked>
电视<input type="checkbox" name="love" value="音乐">
电影<input type="checkbox" name="love" value="电影">
游泳<input type="checkbox" name="love" value="游泳"><br><br>

 

<!-- 单选下拉菜单 -->
城市：
<select name="city" id="">
<optgroup label="城市">
<option name="bj" value="北京" selected>北京</option>
<option name="sh" value="上海">上海</option>
<option name="gz" value="广州">广州</option>
<option name="sz" value="深圳">深圳</option>
</optgroup>
</select><br><br><br>
<!-- 多选下拉菜单 -->
城市：
<select name="city" id="" multiple size="2">
<optgroup label="城市">
<option name="bj" value="北京" selected>北京</option>
<option name="sh" value="上海">上海</option>
<option name="gz" value="广州">广州</option>
<option name="sz" value="深圳">深圳</option>
</optgroup>
</select><br><br><br>
<!-- 浏览框 -->
<input type="file"><br><br>
<!-- 隐藏域 -->
<input type="hidden"><br><br>
<!-- 提交按钮 -->
<input type="submit" value="提交">&nbsp;&nbsp;&nbsp;&nbsp;
<!-- 重置按钮 -->
<input type="reset" value="重置">&nbsp;&nbsp;&nbsp;&nbsp;
<!-- 普通按钮 -->
<input type="button" value="普通按钮">
</form>

 

效果：