<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>这是一个网页</title>
</head>
<body>
<!-- 表单
作用:收集用户的信息
1、关键字 input,单标签
2、必须写的属性type
type的值有:
1、text
这个表单标签应该输入一个文本
maxLength
2、button
表单标签是一个按钮
3、checkbox
复选框
有一个checked属性,作用是可以默认选中复选框
4、file
上传文件
5、hidden
隐形表单
6、image
上传图片
7、password
输入密码(隐藏输入的内容)
8、radio
单选框 通常需要和js配合使用,实现单选的效果
有一个checked属性,作用是可以默认选中单选框
9、reset
重置 清空当前form标签内的所有表单数据
可选属性:
1、value
text:设置文本的默认值
button:设置按钮的名称
2、placholder:设置文本的提示
3、form标签
action="是后台的地址"
method="提交数据的方式 post get"
name="user_register 表明表单的数据的意义"
4、下拉选项
<select name = "选项的意义">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
name:一般写在select标签上
value:一般写在option标签上
selected:一般写在option标签上,表示默认选中某一个选项
label 标签
作用:给表单设置一个贴一个标签
-->
<form>
<!-- <input type="text" placeholder="请输入文本" value="这是一句话"/>
<input type="button" value="提交"/> -->
你的兴趣爱好是什么:<br/>
<input type="checkbox" checked="checked" value="music"/>听音乐
<input type="checkbox" value="movie"/>看电影
<input type="checkbox" value="basketball"/>打篮球
<input type="file"/>
<input type="hidden" value="这是隐藏的信息"/>
<!-- <input type="image"/> -->
<input type="password" placeholder="请输入密码"/>
您的性别是:<input type="radio"> 男 <input type="radio">女
<input type="reset" value="重置"/>
<input type="submit" value="提交"/>
<input type="text" placeholder="请输入用户名,长度不得超过4位" maxlength="4">
<br/>
你喜欢吃什么水果:<br/>
<select name="fruit">
<option value="1">苹果</option>
<option value="2" selected="selected">橘子</option>
<option value="3">菠萝</option>
<option value="4">香蕉</option>
</select>
<br/>
<hr />
<label for="self">请自我介绍:</label><input id="self" type="text" value="这是默认值" placeholder="请输入文本">
<label for="awards">请罗列获得的奖项:</label><textarea id="awards" cols="1" rows="3"></textarea>
</form>
</body>
</html>