<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>form表单相关内容</title>
</head>
<body>
<!--form表单相关内容-->
<!--前后端有数据交互的时候用form表单-->
<!---->
<form action="http://127.0.0.1:8000">
<!--jango里面起的服务-->
<!--action 控制者往哪提交-->
<!--action通常写一个网址或后端程序-->
<!--容器-->
<!--input-->
<input type="text" /><!--框-->
<input type="submit" /><!--按钮-->
<hr />
<!--注册示例--><!--name相当于key返回时作为字典的key-->
<p>用户名：<input name="name" type="text" /></p>
<!--文本框-->
<p>密码： <input name="password" type="password" /></p>
<p>
性别：
<input name="gender" type="radio" value="男" />男
<input name="gender" type="radio" value="女" />女
<!--radio 单选标签 -->
<!--name标签,相同的name控制两个按钮只能选一个-->
<!--不同的name，作为表单的action返回到服务端的字典的key-->
</p>
<hr />
<p>
爱好：
<input name="hobby" type="checkbox" value="basketball" />篮球<!--方框打勾 多选-->
<input name="hobby" type="checkbox" value="football" />足球
<input name="hobby" type="checkbox" value="doublecolorball"/>双色球
</p>
<hr />
<select name="provience" id="s1">
<option value="北京">北京</option>
<option value="上海">上海</option>
<option value="河南">河南</option>
<option value="山东">山东</option>
</select>
<hr />
<p>
<select name="provience2" id="s2"><!--select选项-->
<optgroup label="北京">
<option value="昌平">昌平</option>
<option value="朝阳">朝阳</option>
<option value="海淀">海淀</option>
<option value="丰台">丰台</option>
</optgroup>
<optgroup label="上海">
<option value="浦东新区">浦东新区</option>
<option value="闵行区">闵行区</option>
<option value="黄浦区">黄浦区</option>
</optgroup>
<optgroup label="四川">
<option value="四川">四川</option>
<option value="自贡">自贡</option>
<option value="绵阳">绵阳</option>
</optgroup>
</select>
</p>
<p>
<textarea name="info" id="t1" cols="30" rows="10">
<!--文本框-->
</textarea>
</p>
<hr />
<p>
头像：
<input name="头像" type="file"/>
</p>
<input type="submit" value="提交" />
<!--如果不控制value的话，不同浏览器结果不同-->
<!--这些input都是在form表单里进行的-->
<!--前后端有数据交互的时候用form表单-->
<!--所有获取用户输入的标签都必须放在form表单里面-->
</form>
</body>
</html>
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>form生日+详细</title>
</head>
<!--今日内容-->
<!--前后端数据交互用form表单-->
<!--所有获取用户输入的标签都必须放在form表单里面-->
<!--action控制着往哪提交-->
<!--input\select\textarea 都需要有name属性-->
<!--提交按钮input type="submit"-->
<!--input 系列 text password radio checkbox date datetime file 文件 button(一般用js绑定 reset submit)-->
<!--textarea大段文本 select下拉菜单 option 具体下拉选项 -->
<!--optgroup分组的下拉框-lable="上海"-->
<body>
<!--form表单-->
<form action="http://127.0.01:8000" method="post" enctype="multipart/form-data" autocomplete="on" novalidate>
<!-- 方法默认get 文件格式 自送补全 开启 --><!--邮箱有误不报错-->
<p>生日:<input name="birthday" type="date"></p>
<!-- 返回的key 设定日期列表选择-->
<p><input type="submit" value="提交" /></p>
<!-- 提交 按键显示-->
<p><input type="reset" value="reset重置" /></p>
<!-- 重置 按键提示 -->
<p><input type="email"></p>
<p>
性别：
<input type="hidden" value="hidden">
</p>
<p>
<input name="gender" type="radio" value="1" />男
<input name="gender" type="radio" value="0" />女
<input checked name="gender" type="radio" value="2" />保密
</p>
<p>
<input checked name="hobby" type="checkbox" value="basketball" />篮球
<input name="hobby" type="checkbox" value="football" />足球
<input checked name="hobby" type="checkbox" value="doublecolorball" />双色球
</p>
<p>
用户名：
<input name="name" type="text" readonly value="只读" />
<!-- 输入框 只读 默认值 -->
</p>
<p>
用户名：
<input name="name" type="text" placeholder="占位符" />
<!-- 占位符，获取光标之后取消-->
</p>
<p>
用户名：
<input name="name" type="text" placeholder="禁用的" disabled />
<!-- 禁用的 -->
</p>
<p>
<select name="formal" id="s1">
<option value="bj">北京</option>
<option value="sh">上海</option>
<option value="sc">四川</option>
</select>
</p>
<p>
<select name="formal" id="s2" multiple>
<option value="bj">北京</option>
<option value="sh">上海</option>
<option value="sc">四川</option>
</select>
</p>
<p>
<!---->
<label for="i1">用户名(语义)</label>
<input id="i1" name="name" type="text" value="小强" />
</p>
<p>
<label for="r1">男</label>
<input id="r1" name="gender" type="radio" value="1" />
<label for="r2">女</label>
<input id="r2" name="gender" type="radio" value="0" />
<label for="r3">保密</label>
<input id="r3" checked name="gender" type="radio" value="2" />
</p>
</form>
</body>
</html>
form 表单
原文：https://www.cnblogs.com/Eric-Z-Hack/p/13778775.html
