1.<!-- input标签 type="text"为输入框 -->
2.<!-- placeholder 占位符 -->
3.<!-- button是按钮 -->
4.<!-- input type="radio",表示单选框，设置同样的name属性，使其成为一组 -->
5.<!-- input type="checkbox"时，显示为复选框 -->
6.<!-- textarea为文本域 -->
7.<!-- form为表单，表单里的数据全部提交给服务器 -->
8.显式关联是通过label标签的for属性，显式与另一个表单控件关联。需要注意的是，
for属性的值必须是与label标签在同一文档中的可标记表单元素的id，注意是id而不是name。
8.的例子：
<label for="pass">密码:</label>
<input type="password" name="pass" id="pass" value="" >
注意：label标签
label标签为input元素定义标注(标记)，它不会向用户呈现任何特殊效果，
为了实现点击文字也能选中/取消checkbox或radio。
常用于与checkbox（复选框）或radio（单选框）关联，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常用的表单元素</title>
</head>
<body>
<h1>登录</h1>
<hr>
<!-- input标签 type="text"为输入框 -->
<!-- placeholder 占位符 -->
<input type="text" placeholder="帐号">
<br><br>
<input type="password" placeholder="密码">
<br><br>
<!-- button是按钮 -->
<button>提交</button>
<!-- **************************************************************** -->
<!-- input type="radio",表示单选框，设置同样的name属性，使其成为一组 -->
<br><br><hr>
<input type="radio" id="man" name="sex">
<label for="man">男</label>
<input type="radio" id="woman" name="sex">
<label for="woman">女</label>
<!-- **************************************************************** -->
<br><br><hr>
<input type="button">
<label for="text">姓名:</label>
<input type="text" placeholder="姓名">
<!-- **************************************************************** -->
<br><hr>
<!-- input type="checkbox"时，显示为复选框 -->
<input type="checkbox" id="movie">
<label for="movie">电影</label>
<!-- **************************************************************** -->
<br><hr>
<!-- textarea为文本域 -->
<textarea ></textarea>
<!-- **************************************************************** -->
<br><br><hr>
<div>
<!-- form为表单，表单里的数据全部提交给服务器 -->
<form action="">
<input type="text" placeholder="帐号">
<br><br>
<input type="password" placeholder="密码">
<br><br>
<button type="submit">submit</button>
</form>
</div>
</body>
</html>