- 表单的功能结构
- 文本栏、密码栏、隐藏栏
- 复选栏、单选栏
- 窗体栏位、区块栏位
- 按钮、图像按钮
- 允许上传文件
- 表单的外框和标题
- 元件的次序和快捷键
表单是提供让读者在网页上输入,勾选和选取数据,以便提交给服务器数据库的工具。
7.1 表单的功能结构:
主标记结构:<form>…</form>
属性 值 说明
name 字符串 给这个表单起个名字
method get(默认)/post(建议使用) 表单的传输方式
action url 传输目标(默认传给自己)
7.2 文本栏、密码栏、隐藏栏
文本栏:<input type="text" name="栏位名称" value="栏位内定值(默认输入的值,非必须有)" size="栏位显示宽度" maxlength="栏位数据输入最大长度" readonly="readonly(只读)">
密码栏:<input type="password" name="栏位名称" value="栏位内定值" size="栏位显示宽度" maxlength="栏位数据输入最大长度" readonly="readonly">
隐藏性栏位:<input type="hidden" name="栏位名称" value="栏位值">
7.3 复选栏、单选栏
多重勾选栏位:<input type="checkbox" name="栏位名称(复选栏的栏位名称一般都填相同的)" value="内定值(必须有)" checked="checked(默认勾选)" disabled="disabled(不能修改)">
单选栏位:<input type="radio" name="栏位名称(单选栏的栏位名称一般都填相同的)" value="内定值(必须有)" checked="checked(默认勾选)" disabled="disabled(不能修改)">
7.4 窗体栏位、区块栏位
窗体选项栏位设置:<select name="栏位名称" size="数字" >
<option value="选项值" selected="selected(默认选值)">…
<option value="选项值">…
<option value="选项值">…
</select>
//分组<optgroup label="分组名称"></optgroup>
(<optgroup label="分组名称">
<option value="选项值" selected="selected">…
<option value="选项值">…
<option value="选项值">
</optgroup> )
//多选multiple(<select name="栏位名称" size="数字" multiple>)
文字区块的设置:<textarea cols="设置长度" rows="设置宽度">
………(可以让别人输入意见或建议等用途)
</textarea>
7.5 按钮、图像按钮
按钮设置: <input type="submit(提交)" value="按钮中显示的文字">
<input type="reset(重写)" value="按钮中显示的文字">
按钮图像:<button name="栏位名称" type="图象形态">
<img src="URL">
</button>
图像按钮:<input type="image" src="url" alt="文本">
7.6 允许上传文件
上传栏位:<input type="file" name="file">
7.7 表单加上外框和标题
外 边 框:<fieldset>...</fieldset>
标 题:<legend>...</legend>
7.8 元件的次序和快捷键
accesskey="w" (Alt+w) (Ctrl+w)
tabindex="n"