<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>表单域</title>
</head>
<body>
<!-- 表单域form标签 -->
<form action="">
<!-- input输入元素,type属性值不同,效果不同 -->
<!-- text文本 -->
姓名:<input type="text"><br>
QQ :<input type="text"><br>
<!-- password表示密码 -->
密码:<input type="password"><br>
<!-- radio定义单选按钮 -->
<!-- name定义input输入元素的名称,value是值 -->
性别:男<input type="radio" name="sex" value="man">女<input type="radio" name="sex" value="women"><br>
班级:网络3221 <input type="radio" name="banji" value="3221">网络3222 <input type="radio" name="banji" value="3222">网络3223 <input type="radio" name="banji" value="3223"><br>
<!-- checkbox多选 -->
爱好:羽毛球<input type="checkbox" name="hobby" value="qiu">
跑步<input type="checkbox" name="hobby" value="play">
唱歌<input type="checkbox" name="hobby" value="sing">
旅游<input type="checkbox" name="hobby" value="travel">
品尝美食<input type="checkbox" name="hobby" value="eat">
</form>
</body>
</html>
效果图: