HTML表单设计(上)

时间:2023-03-09 07:20:14
HTML表单设计(上)

1,表单标记<form>...</form>

  <form>...</form>定义表单的开始位置和结束位置,表单提交时的内容就是<form>表单的内容

  基本格式<form action =“服务器端地址(接受表单内容的地址)” name =“表单名称” method=“post/get”>...</form>

  常用属性

  a,name表单名称

  b,method传递数据的方式,分为post和get两种方式

  get方式:get方式提交时,会讲表单的内容附加在URL地址的后面,所以限制了提交的内容的长度,不超过8192字符,且不具备保密性

  post方式:post方式提交时,将表中的数据的数据一并包含在表单主体中,一起传送到服务器中处理,没有数据大小限制

  c,action表单数据的处理程序的URL地址,如果为空则使用当前文档的URL地址,如果表单中不需要使用action属性也要指定其属性为 “no”

  d,enctype设置表单的资料的编码方式

  e,target和超连接的属性类似,用来指定目标窗口

2,文本域和密码<input>标记

  <input>标记没有结束标记

  基本语法<input type=“”  name=“” value=“” size=“” maxlength=“”>

  属性介绍

    a,type属性 有两个值 1,text 当type=“text”时,<input>表示一个文本输入域 2,password  当type=“password”时,<input>表示一个密码输入域

    b,name属性 定义控件的名称

    c,value属性 初始化值,打开浏览器时,文本框中的内容

    d,size属性 设置控件的长度

    e,maxlength属性  输入框中最大允许输入的字符数

3,提交,重置和普通按钮

  a,当<input type=“submit”>时,为提交按钮

  b,当<input type=“reset”>时,为重置按钮

  c,当<input type=“botton”>时,为普通按钮

eg:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单设计</title>
</head>
<body>
<form action="no" method="get">
帐号:<input type="text" name="name" value="" size="5" maxlength="5">
<br><br>
密码:<input type="password" name="password" value="" src="5">
<br><br>
<input type="submit" value="提交">
<input type="reset" value="重置">
<input type="button" value="按钮">
</form>
</body>
</html>