<!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> |
效果图: