实际参考代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单</title>
</head>
<body>
<form action="#">
<div>
<!-- for 与input关联 -->
<label for="name">
姓名:
</label>
<!-- 文本框 占位符 -->
<input type="text"
id="name"
placeholder="请输入用户名"
name="name">
</div>
<div>
<!-- for 与input关联 -->
<label for="pass">
密码:
</label>
<input type="password"
id="pass"
placeholder="请输入密码"
name="pass">
</div>
<div>
<label for="xl">学历:</label>
<!-- 下拉列表框元素 option 列表项 value 是列表值 -->
<select name="xl" id="xl">
<option value="1">大学</option>
<option value="2">中学</option>
<option value="3">小学</option>
</select>
</div>
<div>
<label for="sex">性别:</label>
<!-- 单选按钮元素 name相同就会相互排斥-->
<!-- 设置默认值 value 向表单发送的值 -->
<input type="radio" name="sex" value="1" checked/>男
<input type="radio" name="sex" value="2"/>女
</div>
<div>
<!-- 多选框 -->
<label for="like">爱好:</label>
<input type="checkbox" name="like1"/> 编程
<input type="checkbox" name="like2" checked/> 游戏
<input type="checkbox" name="like3" /> 阅读
</div>
<div>
<!-- 输入多行多列文本内容 -->
<label for="demo">简介:</label>
<textarea name="demo"
id="demo"
cols="30"
rows="10"
readonly>
</textarea>
</div>
<div>
<!-- 提交按钮 -->
<input type="submit" value="注册"/>
<input type="reset" value="重置"/>
</div>
</form>
</body>
</html>