<!-- form 标签 action 提交地址 method 提交方式get 高效 但数据会在url中显示 且传输量小post 效率较低 但数据不在url中显示 且传输量大 -->
<!--name属性作为提交数据时数据的变量名--> <!--value属性作为填充值(多种意义上)--> <!--单选框/多选框中checked代表默认选中--> <!--下拉框中selected代表默认选中-->
input标签
<!--文本输入框 type="text"--> <!-- maxlength 最长输入值 size 文本框长度readonly 只读 hidden 隐藏 disabled 禁用 placeholder 提示信息 required 是否必填 pattern 正则表达式验证 -->
<!--单选框 type="radio"--> <!--name属性用于分组 同一组中只有一个选项可被选中-->
<!--多选框 type="checkbox"--> <!--name属性不一致也可被读取 但习惯性写成一致-->
<!--按钮 type="button" 普通按钮 type="image" 图片按钮 type="submit" 提交按钮 type="reset" 重置按钮 -->
<!--文件域 type="file" 用于从计算机上选择文件-->
<!--文本域 type="textarea" cols 列数 rows 行数 标签间文本（文本内容）为默认内容 -->
<!--搜索框 type="search" 自带清除内容按钮-->
<!--验证 type="email"、"url"、"number"等等-->
<!--滑块 type="range" max、min 设置滑块范围 step 设置最小修改值 -->
跳转至输入
<!-- label 标签for 目标id -->
代码段
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<!--get方法高效 但数据会在url中显示 且传输量小-->
<!--post方法效率较低 但数据不会再url中显示 可传输大文件-->
<form action="1.第一个网页.html" method="get"><!--name属性作为提交数据时数据的变量名--><!--input标签中value属性作为初始值或按钮上的文字--><!--单选框/多选框中checked代表默认选中--><!--下拉框中selected代表默认选中--><strong>文本输入框</strong><!--文本输入框 type="text"--><!--maxlength 最长输入值size 文本框长度readonly 只读hidden 隐藏disabled 禁用placeholder 提示信息required 是否必填pattern 正则表达式验证--><p>用户名：<input type="text" name="id" maxlength="10" size="100" placeholder="输入用户名"></p><p>密码：<input type="password" name="psw"></p><strong>单选框</strong><!--单选框 type="radio"--><!--name属性用于分组 同一组中只有一个选项可被选中--><p>性别：<input type="radio" value="male" name="sex" checked>男<input type="radio" value="female" name="sex">女</p><strong>多选框</strong><!--多选框 type="checkbox"--><!--name属性不一致也可被读取 但习惯性写成一致--><p>爱好：<input type="checkbox" value="code" name="hobby" checked>代码<input type="checkbox" value="game" name="hobby">游戏<input type="checkbox" value="read" name="hobby">阅读</p><strong>按钮</strong><!--按钮type="button" 普通按钮type="image" 图片按钮type="submit" 提交按钮type="reset" 重置按钮--><p><input type="button" value="普通按钮" name="btn"><input type="image" src="../resources/image/Pyke.jpg" height="100" width="200" alt="Pyke图片按钮" title="图片按钮"></p><strong>文件域</strong><!--文件域 type="file" 用于从计算机上选择文件--><p><input type="file" name="files"></p><strong>文本域</strong><!--文本域 type="textarea"cols 列数rows 行数标签间文本（文本内容）为默认内容--><p>反馈<br/><textarea name="textarea" cols="30" rows="10">文本内容</textarea></p><strong>下拉框</strong><!--下拉框--><p>国家：<select name="country"><option value="china" selected>中国</option><option value="us">美国</option><option value="uk">英国</option></select></p><strong>搜索框</strong><!--搜索框 type="search" 自带清除内容按钮--><p><input type="search" name="search" value="搜索框"></p><strong>验证</strong><!--验证 type="email"、"url"、"number"等等--><p>邮箱：<input type="email" name="email"></p><p>url：<input type="url" name="url"></p><p>数字：<input type="number" name="num" max="100" min="0" step="5"></p><p>......</p><strong>滑块</strong><!--滑块 type="range"--><p><input type="range" name="volume" max="100" min="0" step="1"></p><strong>增强鼠标可用性</strong><p><label for="mark">点我输入内容</label><input type="text" id="mark"></p><strong>提交表单</strong><p><input type="submit"><input type="reset"></p>
</form></body>
</html>运行效果
