表单标签简介：
功能：提交数据到某服务器
<form></form>:定义一个表单范围
属性：action：提交到地址，默认提交到当前页面
method：表单提交方式：get（默认）和post
get和post的区别：（1）get请求地址栏会携带提交的数据，post不携带提交的数据
（2）get请求安全性低，post较高
（3）get请求数据大小有限制，post没有限制
输入项:
功能：可以输入内容或者选择内容的部分
大部分的输入项使用<input type="输入项"/>，在每个输入项里面需要一个name属性
a.普通输入项：<input type="text"/>
b.密码输入项：<input type="password"/>
c.单选输入项：<input type="radio"/>
--需要属性name
--name属性值必须相同
--必须有一个value值
*实现默认选中项：设置属性checked=“checked”
d.复选输入项：<input type="checkbox"/>
--需要属性name
--name属性值必须相同
--必须有一个value值
*实现默认选中项：设置属性checked=“checked”
e.文件输入项：<input type="file"/>f.下拉输入项：（不是在input标签中实现）
<select name=" ">
<option value = " ">选项一</option>
<option value = " ">选项二</option>
</select>
g.文本域：<textarea cols = "10" rows = "10">文本内容</textarea>
h.隐藏项：（不会出项在页面上，但是存在于html代码中）
<input type = "hidden"/>
i.提交按钮：
<input type = "submit" value = “显示内容“ />
j.使用图片提交：
<input type = "image" src= “图片路径“ />
k.重置按钮：
<input type = "reset" value = “ 重置注册“ />
---重置是回到输入项的初始状态
l.普通按钮：
<input type = "button" value = “ “ />
-----和js一起使用
所有的标签字符都是在英文字符的情况下输入
举一个栗子
运行结果：
源码：
<html>
<head>
<title> 表单实例 </title>
</head>
<body>
<font size="5"color="#000000" ><b>免费开通人人网账号</b></font>
<form>
<table borber="1" bordercolor="#000000">
<tr>
<td>注册邮箱：</td>
<td><input type="text"/></td>
</tr>
<tr>
<td> </td> <!--单元格占位符是什么？？？-->
<td>你还可以使用账号<a href="#">注册</a>或者<a href="#">手机号注册</a></td>
</tr>
<tr>
<td align="right">创建密码： </td>
<td><input type="password"></td>
</tr>
<tr>
<td align="right"> 真实姓名：</td>
<td><input type="text"></td>
</tr>
<tr>
<td align="right">性别：</td>
<td> <input type="radio" name="sex" value="nv"/checked=“checked”>女<input type="radio" name="sex" value="nan"/>男</td>
</tr>
<tr>
<td align="right"> 生日：</td>
<td>
<select name="year">
<option value="1991" selected="selected">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
</select>
<select name="month">
<option value="1"selected="selected">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<select>
<option value="1"selected="selected">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</td>
</tr>
<tr>
<td align="right">我现在：</td>
<td>
<select name="work">
<option value="study"selected="selected">我正在上学</option>
<option value="work">我已经工作</option>
</select>
</td>
</tr>
<tr>
<td></td>
<td><img src="表单标签.html/picture.gif"/></td>
<td> <a href="#">看不清换一张</a></td>
</tr>
<tr>
<td align="right">验证码：</td>
<td><input type="text" name="yanzhengma"></td>
</tr>
<tr>
<td></td>
<td><input type="image" src="Hydrangeas.jpeg"/></td>
</tr>
</table>
</form>
</body>
</html>
扫一扫
3458
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
