HTML表单和表单控件

在HTML中，一个完整的表单通常由表单控件、提示信息和表单域3个部分构成。

表单控件

input控件

注意事项：
1.<input />标签是单标签
2.input颜色、种类可以变换，可以通过type（类型）属性来变换形状。
input的若干属性如下图所示：

文本框和密码框

示例如下：

结果如下图所示：

单选按钮和复选按钮

单选按钮的话例如性别什么的。
示例如下图所示：

结果如下图：

注意：代码中两个单选这个地方有name=“sex”，如果没有name=”sex“这个地方的话，男 女两个按钮都可以选择。name="sex"说明这两个是一类。
如果是一组，我们通过相同的name值来实现。
接下来再说下复选按钮。 复选框可以同时选择多个。
示例如下：

结果如下图所示：

如果想要默认选中表单属性。就在标签中加入checked=“checked”。示例如下：

结果如下图所示：

input按钮组

上面中提到的button等后面的属性大部分都是按钮。
接下来在一个例子中说明这些按钮。

示例如下：

结果如下：

这个图片就是在我路径下的33.bmp。具体实现的功能的话就要依靠js，也是后面讲的。

最多字符数和默认文本值

这两个就是上面中提到的value和maxlength这两个属性。
maxlength比如密码最多输入是6个，就更改这个地方。当输入的多于6个的时候就输入不进去。当之后学习了js之后，也可以限定这个地方仅输入字母啥的。
默认文本值就是上文中提到的“请输入你的用户名”。后面学了css可以改变样式。

label标签

label标签为input元素定义标注（标签）。

作用： 用于绑定一个表单元素，当点击label标签的时候，被绑定的表单元素就会获得输入焦点。
for属性规定label与哪个表单元素绑定
作用比如：

当鼠标点击“邮箱账号”的时候，光标会定位到右边的输入框。
第一种情况：用label直接进行包裹input就可以了
第二种情况：如果label里面有多个表单，想要定位到某个 可以通过for id的格式来进行。
示例如下：

结果如下：

textarea控件(文本域)

如果要是输入大量的信息，就需要用到<textarea></textarea>标签，通过这个可以轻松的创建多行文本输入框。基本的语法格式如下：(这个功能主要是做留言的)

<textarea cols="每行中的字符数" rows="显示的行数">文本内容</textarea>
后面这个cols rows很少用，一般都是靠css来控制。

示例如下：

结果如下：

下拉菜单

这个其实就是来实现下拉按钮的。
使用select控件定义下拉菜单的基本语法格式如下：

<select>
<option>选项1</option>
<option>选项2</option>
<option>选项3</option>
.....
</select>

注意：1.selsect中应该至少包含一对<option>
2.在option中定义selected="selected"时，当前项即为默认选项。

实例如下：

结果如下图：

表单域（最重要的 会涉及到与后端的链接）

我们学了三个域：
1.文本域 textarea 主要用于留言的
2.文件域 input type=“file” 上传文件的
3.表单域 form 收集表单控件信息 并且提交的。
创建表单的基本语法格式如下：

<form action="url地址" method="提交方式" name="表单名称">
各种表单控件
</form>

常见属性：
1.action在表单收集到信息后，需要将消息传递给服务器进行处理，action属性用于指定接收并处理表单数据的服务器程序的url地址。（现在学的html根本看不到怎么往后台传数据的，等到学了ajax就知道怎么往服务器传数据了。后面有个课程是ajax）
2.第二个是重点method,取值为get或者post （如果有多个表单的话 传到后台的话 需要给他们取个名字来区分开 就是name属性）
get提交速度比较快但是不安全，他会显示出你的内容来，不能做密码提交的。一般会用post提交。
post速度慢一些 但是不会显示表单内容 安全一些。
3.name 一个页面中可能会有很多不同的form 区别不同的form就会用到name.
示例如下：

结果如下：

重置按钮也会有用！！！