关于form表单的使用方法
form表单标签基本形式为<form></form>可设置多种标签，其中常用的标签有用来设置单行文本框的input标签，用来设置上下拉选择框的select标签，还有添加的多行文本框的textarea标签。
下面我们来详细介绍一下这三种标签及其各种属性的用法：
一、input标签
对input标签的使用主要有对type的使用，先列举一段最简单的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户注册</title>
</head>
<body>
<form>
用户名：<input type="text">
密码：<input type="password">
<input type="submit" value="提交">
</form>
</body>
</html>运行结果：
其中：type="text"---------普通文本框用户名，用以输入可见内容
type="password"---------密码框，输入内容会隐藏
type="submit"---------提交按钮，页面内容填写完毕后的提交跳转按钮，需要与action标签合用下文会举例；
其他type标签及其用法如下：（看完方便理解之后的代码)
type="radio"---------单选按钮，设置多个选项但只能选择一项，如性别
type="checkbox"---------多选按钮，设置多个选项，且可以选择多项
type="button"---------普通按钮
type="reset"---------复位按钮，重置页面所填信息为初始状态
type="image"---------图片按钮，使用一张图片做按钮
type="hidden"---------隐藏域
type="file"---------文本域，设置可选择电脑文本的按钮
在设置完type类型后可直接在后面添加以下属性：
name----所设元素的名称
value----所设元素的值
id-------所设元素的唯一标识符
size------元素的宽度，以字符数设定
maxlength----元素能接受的字符个数上限
下面列举了一段功能相对齐全的代码（已注释）：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户注册</title>
</head>
<body bgcolor="#e3dede"><!-- 设置了背景颜色 -->
<div align="center"><!-- 设置了内容的位置 -->
<form method="post" action=".\demo02.html"><!-- method-post设置隐藏密码不显示在跳转网站中；action指定点击“提交”按钮后跳转的文件或者网站 -->
<h2>用户注册</h2><!-- 二级标题 -->
<p>用户名：<input type="text"/></p>
<p>密 码：<input type="password"></p>
<p>
请选择你的性别：
<input type="radio" value="男" checked="checked" name="denger">男
<input type="radio" value="女" name="denger">女
</p><!-- 这里用radio设置单选按钮，用checked设置默认选择男 -->
<p>
请选择您的爱好：<br>
<input type="checkbox" value="计算机" name="book">计算机
<input type="checkbox" value="心理学" name="book">心理学
<input type="checkbox" value="管理学" name="book">管理学
<input type="checkbox" value="人际交往" name="book">人际交往
<input type="checkbox" value="历史" name="book">历史
</p><!-- 这里用checkbook设置了多选按钮 -->
<p>
邮箱：<input type="email" name="email" placeholder="请输入您的邮箱">
</p><!-- 这里的placeholder设置了文本框内可更改文字 -->
<p>
附加文件：<input type="file" value="选择文件">
</p><!-- 这里用file设置了可选择上传文件的格子 -->
<p>
请选择您喜欢的颜色：
<input type="color"><br><!-- 这里可选择你喜欢的颜色 -->
注册时间：<input type="datetime-local">
</p> <!-- 这里可选择时间，除了datetime-local还可用date，time来设置选择时间的按钮这里就不一一演示了 -->
<p>
<input type="submit" value="注册"><!-- 用来跳转页面的按钮 -->
<input type="reset" value="重置"><!-- 刷新页面为初始状态 -->
</p>
</form>
</div>
</body>
</html>运行结果：
排版不是很好，后期作品会介绍用table表格辅助排版
需要弄清楚<p>;<h1>;<br>这几个最基础的标签的用法，掌握有关input中可用的type，value等标签的含义和用法，上文已给出。
二、select标签
重新另设置新段落加入select设置选项框：
<p>
您的家庭住址是：
<select>
<option value="西安">西安</option>
<option value="重庆">重庆</option>
<option value="北京">北京</option>
<option value="上海">上海</option>
</select><!-- 设置了隐藏选项的下拉选项框 -->
</p>
<p>
您的收货地址是：
<select multiple="multipie">
<option value="请选择收获地址">请选择收获地址</option>
<option value="永川">永川</option>
<option value="江北">江北</option>
<option value="万州">万州</option>
<option value="黔江">黔江</option>
</select><!-- 设置了未隐藏选项的直接展示的选项框 -->
</p>运行结果：
注意：这里出现了新标签option，不再是input标签了。选项是否隐藏的关键是有无multipie标签
三、textarea标签
学会上面介绍的各种标签的用法后textarea标签的用法就简单了：
<p>
请留下建议或意见：
<textarea name="name" cols="30" rows="5">你的建议或意见</textarea>
</p><!-- 设置了宽度为30，高度为5的可编辑文本框-->运行结果：
完整代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户注册</title>
</head>
<body bgcolor="#e3dede"><!-- 设置了背景颜色 -->
<div align="center"><!-- 设置了内容的位置 -->
<form method="post" action=".\demo02.html"><!-- method-post设置隐藏密码不显示在跳转网站中；action指定点击“提交”按钮后跳转的文件或者网站 -->
<h2>用户注册</h2><!-- 二级标题 -->
<p>用户名：<input type="text"/></p>
<p>密 码：<input type="password"></p>
<p>
请选择你的性别：
<input type="radio" value="男" checked="checked" name="denger">男
<input type="radio" value="女" name="denger">女
</p><!-- 这里用radio设置单选按钮，用checked设置默认选择男 -->
<p>
请选择您的爱好：<br>
<input type="checkbox" value="计算机" name="book">计算机
<input type="checkbox" value="心理学" name="book">心理学
<input type="checkbox" value="管理学" name="book">管理学
<input type="checkbox" value="人际交往" name="book">人际交往
<input type="checkbox" value="历史" name="book">历史
</p><!-- 这里用checkbook设置了多选按钮 -->
<p>
邮箱：<input type="email" name="email" placeholder="请输入您的邮箱">
</p><!-- 这里的placeholder设置了文本框内可更改文字 -->
<p>
附加文件：<input type="file" value="选择文件">
</p><!-- 这里用file设置了可选择上传文件的格子 -->
<p>
您的家庭住址是：
<select>
<option value="西安">西安</option>
<option value="重庆">重庆</option>
<option value="北京">北京</option>
<option value="上海">上海</option>
</select><!-- 设置了隐藏选项的下拉选项框 -->
</p>
<p>
您的收货地址是：
<select multiple="multipie">
<option value="请选择收获地址">请选择收获地址</option>
<option value="永川">永川</option>
<option value="江北">江北</option>
<option value="万州">万州</option>
<option value="黔江">黔江</option>
</select><!-- 设置了未隐藏选项的直接展示的选项框 -->
</p>
<p>
请留下建议或意见：
<textarea name="name" cols="30" rows="5">你的建议或意见</textarea>
</p><!-- 设置了宽度为30，高度为5的可编辑文本框-->
<p>
请选择您喜欢的颜色：
<input type="color"><br><!-- 这里可选择你喜欢的颜色 -->
注册时间：<input type="datetime-local">
</p> <!-- 这里可选择时间，除了datetime-local还可用date，time来设置选择时间的按钮这里就不一一演示了 -->
<p>
<input type="submit" value="注册"><!-- 用来跳转页面的按钮 -->
<input type="reset" value="重置"><!-- 刷新页面为初始状态 -->
</p>
</form>
</div>
</body>
</html>运行结果：
点击注册会跳转到我指定的页面。
总结：
对于初学者，自己在敲代码前可先思考一下需要用到的各种功能的标签及其含义，如比较模糊可先在纸上手写一个大致的草稿。要养成不看笔记手撕代码的好习惯，这样可以极大的加强我们对于各种标签的记忆深度并加强我们对代码的理解。学会培养自己独立思考的习惯，有利于加强后期自己设计作品时有自己独特的思路。
