HTML超文本标记语言3
三、HTML表单标签
1.form标签
<form>
form标签
name=表单名称,action=表单提交的地址,method=表单提交方式:get/post
get/post详解:
1.get提交数据时:把数据加在地址栏后面,格式:?name=value&name=value post提交数据:封装在主体,格式:username=ls&password=234&sex=male&hobby=sing&city=bj#
2.get限制大小(浏览器不一样);post不限制
3.get相对不安全,post相对安全
</form>
2.input标签
name属性必写
<input type="name" />
type="text":文本输入框 name=“username” value=“老朱”
type="password" 密码输入框,以掩码显示
type="radio" 单选 name=“NA” 值是NA,设置两个一样的值的单选按钮,可以让这两个按钮实现互斥;checked=“checked” 默认选中
type="file"上传文件
type="button" 按钮,无内置功能
type="submit" 有功能:按action设置的地址进行提交
type="reset" 有功能:重置,清空内容
type="image" 图片提交按钮,等同submit、src=“图片所在地址”,alt=“提示”,
type=“hidden” 隐藏表单。在提交数据时服务器需要某个数据,但不向用户显示
3.文本域标签
<textarea
name="textarea"
列数cols="40"
行数rows="20"
></textarea>
实例:
body主要代码:
<!-- 表单标签 -->
<form name="myForm" action="#" method="post">
<table>
<tr>
<td>
姓名
</td>
<td><!-- input -->
<input type="text" name="name" value="">
</td>
</tr>
<tr>
<td>
密码
</td>
<td>
<input type="password" name=passworld value="">
</td>
</tr>
<tr>
<td>
性别
</td>
<td>
<input type="radio" name="Sex" checked="checked" value="male">男
<input type="radio" name="Sex" value="female">女
</td>
</tr>
<tr>
<td>
优点
</td>
<td>
<input type="checkbox" name="yd" checked="checked" value="hk">好看
<input type="checkbox" name="yd" value="sl">善良
<input type="checkbox" name="yd" value="syht">声音好听
<input type="checkbox" name="yd" value="tc">腿长
</td>
</tr>
<tr>
<td>
上传文件
</td>
<td>
<input type="file" name="file">
</td>
</tr>
<tr>
<td>
地址
</td>
<td> <!-- select -->
<select name="city">
<option >广州</option>
<option >湛江</option>
</select>
<select>
<option>天河</option>
<option >吴川</option>
</select>
</td>
</tr>
<tr>
<td>
邮箱
</td>
<td>
<input type="text" name="email" value="">
</td>
</tr>
<tr>
<td>
备注
</td>
<td>
<textarea name="textarea" cols="40" rows="20"></textarea>
</td>
</tr>
<tr>
<td>
<input type="button" value="button">
<input type="submit" value="submit">
<input type="reset" value="reset">
</td>
</tr>
<tr>
<td>
<input type="image" src="../images/zc.png" alt="提示" >
</td>
</tr>
</table>
</form>
图例:
注:未经同意请勿转载,仅作学习使用。以上有描述不正确之处,望大家能不吝指出,共同学习共同进步。谢谢