HTML+CSS学习笔记2

1、使用单选框、复选框，让用户选择

在使用表单设计调查表时，为了减少用户的操作，使用选择框是一个好的方法，HTML中有两种选择框，即单选框和复选框，两者的区别是单选框中的选项用户只能选择一项，而复选框中用户可以任意选择多项，甚至全选。

语法：<input type="radio/checkbox" value="值" name="名称" checked="checked" />

type:当type="radio"时，控件为单选框；当type=”checkbox“时，控件为复选框；

value：提交数据到服务器的值（后台程序PHP使用）

name:为控件名，以备后台程序ASP、PHP使用

checked：当设置checked=”checked“时，该选项被默认选中。

同一组的单选按钮，name取值一定要一致，这样同一组的单选按钮才可以起到单选作用。

2、使用下拉列表框，节省空间

下拉列表在网页中也会常用到，它可以有效的节省网页的空间，既可以单选、又可以多选。

selected="selected"，设置selected=”selected“属性，则该选项就被默认选中。

3、使用下拉列表框进行多选

下拉列表也可以进行多选操作，在<select>标签中设置multiple="multiple"属性，就可以实现多选功能，在Windows操作系统下，进行多选时按下Ctrl键同时进行单机（在Mac下使用command+单击），就可以选择多个选项。

4、使用提交按钮，提交数据

在表单中有两种按钮可以使用，分别为：提交按钮、重置。当用户提交表单信息到服务器时，需要用到提交按钮。

语法：

<input type="submit" value="提交">

type：只有当type值设置为submit时，按钮才有提交作用

value：按钮上显示的文字

5、使用重置按钮，重置表单信息

当用户需要重置表单信息到初始时的状态时，可以使用重置按钮使输入恢复到初始状态。只需要把type设置为‘reset'就可以。

语法：

<input type="reset" value="重置">

type：只有当type值设置为reset时，按钮才有重置作用

value：按钮上显示的文字。

6、form表单中的label标签

label标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在label标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，浏览器就会自动将焦点转到和标签相关的表单控件上（就会自动选中和该label标签相关联的表单控件上）。

语法：

<label for="控件id名称">

注意：标签的for属性中的值应当与相关控件的id属性值一定要相同。