目录
表单用<from>
标签页来使用
<form action="提交地址" method="get/post"
- action:表单提交的位置
- methed: post/get提交方式
- get方式提交:我们可以在页面中看到我们提交的信息,不安全
- post:比较安全,传输大文件。
文本输入框
- <input type=“text”>
- value=“值” , 默认初始值,可更改
- maxlength= 字符的长度
- size=“大小” , 文本框的长度
- name=名称
密码框
- <input type=“password”>
- value=“值” , 默认初始值,可更改
- maxlength= 字符的长度
- size=“大小” , 文本框的长度
- name=名称
单选框
多选一
- <input type="radio">
- radio=单选按钮
- value=英文
- name=名字要填写一样
- checked=默认选中的值
复选输入框
定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项
- <input type=“checkbox”>
- value=英文
- name=名称可不同,但最好一致
- checked=默认选项
列表框
- <select name=" " size=" " >
- <option value=" "></option>
- name=名称
- value=英文
- selected=默认选项
多行文本域
- <textarea name="名称" cols="列" rows="行"
- name=名称
- cols=列数,宽度
- rows=行数,高度
提交按钮
具有提交功能
- <input type="submit" >
重置按钮
点击重置按钮,所有信息将被清空
- <input type="reset" >
图片按钮
具有提交功能
- <input type="image" src="图片地址">
普通按钮
没有提交功能
- <input type="botton" >
文件域
上传文件
- <input type="file" name="echo" >
作业
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
<div>
<img src="./素材/image/renren_titile.gif">
</div>
<div>
<p>人人网,中国<strong>最真实,最有效</strong>的社会平台,加入<br>
人人网,找回老朋友,结交新朋友。
</p>
</div>
</div>
<div>
<form method="get">
<p>
电子邮箱:<input type="text" name="Emali" maxlength="50">
</p>
<p>
设置密码:<input type="password" name="mima" maxlength="60">
</p>
<p>
真实姓名:<input type="text" name="Name" maxlength="8">
</p>
<p>
性别:<input type="radio" name="zhang" value="man" checked>男
<input type="radio" name="zhang" value="woman" >女
</p>
<select name="birthday" >
<option value="sy">1991</option>
<option value="se">1992</option>
<option value="shi">1993</option>
</select>
<select name="birthday" >
<option value="ten">10</option>
<option value="eleven" selected>11</option>
<option value="twelve">12</option>
</select>
<select name="birthday" >
<option value="thirty">30</option>
<option value="thirty-one">31</option>
<option value="ten">10</option>
</select>
</p>
<p>
为什么要填写我的生日?
</p>
<p>
我现在:
<select name="sf" >
<option value="sf">请选择身份</option>
<option value="sf">团员</option>
<option value="sf">党员</option>
</select>
(非常重要)
</p>
<p>
<input type="image" src="./素材/image/renren_code.gif">
<a href="*">看不清换一张</a>
</p>
<p>
验证:<input type="text" name="yzm" maxlength="5">
</p>
<p>
<input type="image" src="./素材/image/renren.gif" name="anniu">
</p>
</form>
</div>
</div>
</body>
</html>