html单选框复选框怎么用

html-css012

html单选框复选框怎么用,第1张

在使用表单设计调查表时,为了减少用户的操作,使用选择框是一个好主意,html中有两种选择框,即单选框和复选框,两者的区别是单选框中的选项用户只能选择一项,而复选框中用户可以任意选择多项,甚至全选。请看下面的例子:

语法:

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

1、type:

当 type="radio" 时,控件为单选框

当 type="checkbox" 时,控件为复选框

2、value:提交数据到服务器的值(后台程序PHP使用)

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

4、checked:当设置 checked="checked" 时,该选项被默认选中

注意:同一组的单选按钮,name 取值一定要一致,比如上面例子为同一个名称“radioLove”,这样同一组的单选按钮才可以起到单选的作用。

创建复选框控件。Creates a check box control.注释当 INPUT type=checkbox 元素被选中时,将向 FORM 提交 name/value 的一对值。INPUT type=checkbox 的默认值是 on。INPUT type=checkbox 元素的 height 和 width 样式是从 Internet Explorer 5 版本起实现的。元素的大小设置基于作者提供的值,除非给定的大小低于所需的最小值。大小的尺寸计算如下:若 height 或 width 大于 20 像素,复选框四周的间隙 (padding) 将设置为 4 像素,内部高度或宽度将设置为 8 像素。若 height 或 width 小于 20 像素但大于 13 像素,复选框四周的间隙 (padding) 将等于所指定的 height 或 width 减去 13 的差的一半。例如,若指定复选框的 width 是 17,四周间隙将是: (17-13)/2 = 2 像素。若 height 或 width 小于 12 像素,复选框四周的间隙 (padding) 将设置为 0, 且内部宽度将设置为作者指定的值。此元素在 Internet Explorer 3.0 及以上版本的 HTML 和脚本中可用。此元素是一个内嵌元素。此元素不需要关闭标签。When an INPUT type=checkbox element is selected, a name/value pair is submitted with the FORM. The default value of INPUT type=checkbox is on.The height and width styles are exposed to the INPUT type=checkbox element as of Internet Explorer 5. The size of the element is set based on the values provided by the author, except when a given size is below a particular minimum. The size is calculated as follows:If the height or width is greater than 20 pixels, the padding around the check box is set to 4 pixels, and the inner height or width is set to 8 pixels.If the height or width is less than 20 pixels but greater than 13 pixels, the padding around the check box is equal to one half the specified height or width minus 13. For example, if the specified width of the check box is 17, the equation would be: (17-13)/2.If the height or width is less than 12 pixels, the padding around the check box is set to 0 and the inner width is set to the value specified by the author.This element is available in HTML and script as of Internet Explorer 3.0.This element is an inline element.This element does not require a closing tag.示例代码下面的例子使用 INPUT type=checkbox 元素创建了两个带有解释文本的复选框。onclick 事件将调用两个脚本函数。第一个复选框默认选中。This example uses the INPUT type=checkbox element to create two check boxes with explanatory text. The onclick events call two script functions. The first check box is checked.<INPUT TYPE=checkbox CHECKED ID=chk1 onclick=choosebox1()Uncheck this check box for some free advice.<P<INPUT TYPE=checkbox ID=chk2 onclick=choosebox2()Or check this check box for a message from our sponsors.<P ID=SampText下面的例子就是用户单击复选框时调用的脚本。