复习HTML+CSS（6）

n  表格和表单的嵌套顺序

n  单行文本域

• 语法格式：<input type=”text” 属性=”值”>
• 常用属性

l  Name：文本框的名字。命名规则：可以包含字母、数字、下划线，只能以字母开头。

l  Type：表单元素的类型。

l  Value：文本框中默认的值。

l  Size：文本框的长度，以“字符”为单位。

l  maxLength：最多可以输入多少个字符，超出的就输不进去了。

l  readonly：只读属性。可以选中，但不能修改。如：readongly=”readonly”

l  disabled：禁用属性。不能选中，不能修改。如：disabled=”disabled”

n  单行密码框

• 语法格式：<input type=”password” 属性=值“” />
• 常用属性

l  Name：密码框的名字。命名规则：可以包含字母、数字、下划线，只能以字母开头。

l  Type：表单元素的类型。

l  Value：文本框中默认的值。

l  Size：文本框的长度，以“字符”为单位。

l  maxLength：最多可以输入多少个字符，超出的就输不进去了。

l  readonly：只读属性。可以选中，但不能修改。如：readongly=”readonly”

l  disabled：禁用属性。不能选中，不能修改。如：disabled=”disabled”

n  单选按钮

• 语法格式：<input type=”radio” 属性=“值” />
• 常用属性

l  Name：元素的名称

l  Value：元素的值，该value中的数据将发往服务器。

l  Checked：默认选择哪一项。如：check=”check”

注意：一组单选按钮，只能选择一个，但name的值必须一致。如：name=”sex”

单选按钮用户自己不能输入内容，用户只能选择，因此必须为它指定默认值value。

n  复选框

• 语法格式：<input type=”checkbox” 属性=“值” />
• 常用属性：name：元素的名称。
• Checked：默认选中。如：checked=”checked”

注意：复选框也是一组选项，因为name的值必须一致，在PHP中，使用数组来获取多个同名的name的值。

复选框可以同时选多个，也可以一个都不选。

n  下拉列表

<select name=”名称”>

<option value=”北京市”>北京市</option>

<option value=”天津市”>天津市</option>

<option value=”重庆市”>重庆市</option>

</select>

<select>标记的属性，只有一个name属性

<option>标记的属性有两个：value属性、selected属性

Selected：默认选中。如：selected=”selected”

n  文本区域

• 语法格式：<textarea name=”名称” cols=”宽度” rows=”高度”></textarea>
• 常用属性：

u  Name：元素名称

u  Cols：宽度，是指多少个字符宽。

u  Rows：高度，是指几行高，

• 提示：<textarea>和<textarea>之间是默认文本。

n  各种按钮

• 提交按钮：<input type="submit" value="提交按钮" />
• 重置按钮：<input type="reset" value="重新填写" />
• 图片按钮： <input type="image" src="data:images/3.png" />   //功能就是提交表单，与submit按钮功能一样
• 普通按钮：<input type="button" onclick="javascript:window.close()" value="关闭窗口" />

u  普通按钮本身是不具备任何功能的，一般要与JS程序配合使用，实现相应的功能

n  隐藏域

功能：隐藏域就是一个看不见的框。传递一些值，而这个值又不想让别人看见。

用处：主要用于PHP后台程序，如：修改某一条新闻内容时，需要传递一个新闻的id号。

语法格式：<input type=”hidden” name=”名称” value=”默认值” />

n  上传文件域

• 语法格式：<input type=”file” 属性=“属性”>
• 常用属性

l  Name：表单元素的名称

l  Value：表单元素的值，这个值其实就是上传的文件名。Value属性是只读属性，这个value的内容只能来自手动选择上传的文件，而不能用户自己指定一个路径。为了安全起见，value是只读的。

<td><input type="file" name="uploadFile" /></td>

n  <caption>表格标题

语法格式：<caption></caption>

提示：<caption>标记是table的子标记。<caption>放在<table>开始标记之后。