网页设计——入门与提高 作者 王维 吴菲 王丽娜 第09章.pptVIP

第9章 表单 在线教务辅导网： 教材其余课件及动画素材请查阅在线教务辅导网 QQ:349134187 或者直接输入下面地址： 9.1 建立表单 表单是网页上的一个特定区域，建立表单的标签是form和/form。其语法格式如下： form标签有三个属性，其中name属性用来定义表单的名称；method属性用来定义表单结果从浏览器传送到服务器的方式，属性的值为get和post；action属性用来指定表单处理程序的位置。 form name=”表单名称” method=”传送方式” action=”表单 处理程序地址” …… /form 9.2 输入标记 input标签是表单中的输入标记，它是一个单标签。其语法格式如下： input name=”标记名称” type=”类型” 9.2.1 文本框 当type的类型为text时，显示的就是文本输入框。其属性值还包括value、size和maxlength。其中value用来设置文本框中的初始值；size用来设置文本框的显示宽度；maxlength用来设置文本框允许用户输入的最大字符数。其语法格式如下： input name=”标记名称” type=”text” size=”宽度” maxlength=” 最大字符数” value=”初始值” 9.2.2 密码框 当type属性设置为“password”时，就会产生一个密码输入框，它的使用方法与text很相似，差别仅在于密码框输入时会以星号或圆点来取代输入的字符，以保证密码的安全性。其语法格式如下： input name=”标记名称” type=”password” size=”宽度” maxlength=”最 大字符数” 9.2.3 单选按钮 当type属性设置为radio时，就会产生单选按钮，单选按钮通常是多个选项一起出现供访问者选择，并且一次只能选择一个，因此称为单选按钮。语法格式如下： 单选按钮通常需要设置两个属性：checked和name属性。其中checked属性，当需要将某个单选按钮的初始状态设置为被选中时，就将其checked属性设置为true；name属性，需要将一组供选择的单选按钮设置为相同的名称，以保证这一组中只能有一个项目被选中，这一组单选按钮被称作单选按钮组。 input type=”radio” name=”标记名称” value=”提交值” checked=”选中状态” 9.2.4 复选按钮 当type属性设置为“checkbox”时，就会产生复选按钮。复选按钮与单选按钮类似，也是一组放在一起供访问者选择的。多选按钮与单选按钮的区别是可以同时选中一组中的多个选项。语法格式如下： 复选按钮通常需要设置两个属性：checked和name属性。其用法与单选按钮相同，唯一的区别是checked属性可以同时将多个复选按钮设置为“true”。 input type=”checkbox” name=”标记名称” value=”提交值” checked=”选中状态” 9.2.5 按钮 表单中的按钮起着至关重要的作用，它主要有以下几种类型：提交按钮、重置按钮、普通按钮和图像按钮。 提交按钮 重置按钮 input type=”submit” name=”标记名称” value=”按钮显示文字” input type=”reset” name=”标记名称” value=”按钮显示文字” 9.2.5 按钮 普通按钮 图像按钮 input type=”button” name=”标记名称” value=”按钮显示文字” input type=”image” name=”标记名称” src=”图像路径” 9.3 选择标记 在表单中，通过select和option标签就可以在浏览器中出现一个下拉菜单或列表菜单。这两个选择标签均可以很好地节省网页的空间。下拉菜单最节省网页空间，正常状态下浏览者只能看到一个选项，单击按钮打开菜单后才看到全部选项。列表菜单可以显示一定数量的选项，如果超出了这个数量，会自动出现滚动条。其语法格式如下： size属性表示显示的项目数目，multiple属性表示列表中的项目允许多选。 select name=”名称” size=”选项数目” multiple=”同时选中多” option value=”提交值” selected=”