form表单
应用场景:提供给用户输入的位置
作用:将客户端用户输入的数据送到服务器端
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>form表单</title>
</head>
<body>
<!--action是数据提交的网址,method是动作,其中有get和post,get提交的数据会显示,不安全,post不显示,相对安全-->
<form action="数据提交的地址" method="post" enctype="multipart/form-data">
<!--用enctype属性,来标志当前的附件是特殊文件,和普通传递的数据不一样-->
<!--required当数据为空时,不允许提交 autofocus自动获得焦点 -->
用户:<input type="text" name="username" value="" autofocus required placeholder="请输入用户名"/><br /><br />
头像:<input type="file" name="userpic" multiple accept="image/*"><br /><br />
密码:<input type="password" name="password" value="" placeholder="请输入密码"/><br /><br />
性别:
<input type="radio" name="sex" value="男" checked/>男
<input type="radio" name="sex" value="女" />女<br /><br />
年龄:<input type="number" name="age" min="1" max="200"/><br /><br />
爱好:
<select name="like" multiple>
<option value="游泳" selected>游泳</option>
<option value="健身">健身</option>
<option value="滑轮">滑轮</option>
<option value="篮球">篮球</option>
</select><br /> <br />
喜欢的明星:
<input type="checkbox" name="start" value="迪丽热巴" />迪丽热巴
<input type="checkbox" name="start" value="易烊千玺" />易烊千玺
<input type="checkbox" name="start" value="罗志祥" />罗志祥
<input type="checkbox" name="start" value="张艺兴" />张艺兴
<br /><br />
学历:
<select name="edu">
<option value="专科">专科</option>
<option value="本科">本科</option>
<option value="研究生">研究生</option>
<option value="硕士">硕士</option>
<option value="博士">博士</option>
</select><br /> <br />
签名:<textarea name="qianming" rows="5" cols="3"></textarea><br /> <br />
<!--
disable 禁止
readonly 只读
-->
邮箱:<input type="email" name="email" value="1140841562@qq.com" disabled /><br /> <br />
QQ:<input type="number" name="qq" value="" /><br /><br />
博客:<input type="url" name="url" /><br /><br />
年月日:<input type="date" name="date" /><br /><br />
时分秒:<input type="time" name="time" /><br /><br />
星期:<input type="week" name="week" /><br /><br />
月份:<input type="month" name="month"/><br /><br />
喜欢的颜色:<input type="color" name="color" /><br /><br />
范围:0<input type="range" value="30" max="100" />100<br /><br />
<button>这是button按钮</button>
<input type="submit" value="注册" />
<input type="reset" value="重置" />
<input type="image" src="img/.." />
</form>
</body>
</html>