<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>day4-表单</title>
</head>
<body>
<!-- input标签 -->
文本框,用于输入单行文本:<input type="text"><br>
密码框: <input type="password"><br>
单选框,多选一:
<input type="radio" name="0">语文
<input type="radio" name="0">数学
<input type="radio" name="0">英语
<br>
多选框,多选多:
<input type="checkbox" name="0">北京
<input type="checkbox" name="0">天津
<input type="checkbox" name="0">上海
<input type="checkbox" name="0">厦门
<br>
选择文件,上传文件:<input type="file"><br>
提交按钮: <input type="submit"><br>
重置按钮: <input type="reset"> <br>
普通按钮: <input type="button" value="按钮"><br><br>
<hr>
<!-- 占位符placeholder -->
用户名:<input type="text" placeholder="请输入用户名"><br>
密码: <input type="password" placeholder="请输入密码">
<hr>
<!-- 单选功能和默认选中,同理多选框 -->
<!-- name:分组 -->
<!-- checked:默认选中 -->
学科:
<input type="radio" name="subject" checked>语文
<input type="radio" name="subject">数学
<input type="radio" name="subject">英语
<hr>
<!-- 上传多个文件:multiple -->
上传单个文件:<input type="file"><br>
上传多个文件:<input type="file" multiple>
<hr>
<!-- 按钮 -->
<!-- 属性value-添加显示文字 -->
<form>
用户名:<input type="text" placeholder="请输入用户名"><br>
密码: <input type="password" placeholder="请输入密码"><br>
<!-- 提交按钮和重置按钮需要在表单中使用 -->
<input type="submit">
<input type="submit" value="免费注册">
<input type="reset">
<input type="button" value="注册">
</form>
<hr>
<!-- button按钮标签 -->
<button>按钮</button>
<button type="submit">提交按钮</button>
<button type="reset">重置按钮</button>
<button type="button">普通按钮,没有任何功能</button>
<hr>
<!-- select下拉菜单 -->
<!-- selected:默认选中 -->
下拉菜单:<br>
<select>
<option>北京</option>
<option>上海</option>
<option>广州</option>
<option >厦门</option>
</select>
<select>
<option>北京</option>
<option>上海</option>
<option>广州</option>
<option selected>厦门</option>
</select>
<hr>
<!--textarea文本域,右下角可拖曳改变大小 -->
<!-- cols:规定可见宽度; rows:规定可见行数 -->
<textarea cols="30" rows="10"></textarea>
<hr>
<!-- label:点击文字可选中 -->
<!-- 方法一:复杂 -->
性别:
<input type="radio" name="sex" id="nan"><label for="nan">男</label>
<input type="radio" name="sex" id="nv"><label for="nv">女</label>
<br><br>
<!-- 方法二:简单 -->
性别:
<label><input type="radio" name="sex1">男</label>
<label><input type="radio" name="sex1">女</label>
</body>
</html>