<!DOCTYPE html> <html lang="zh"> <head> 　　<meta charset="UTF-8"> 　　<meta name="viewport" content="width=device-width, initial-scale=1.0"> 　　<meta http-equiv="X-UA-Compatible" content="ie=edge"> 　　<title>表单</title> </head> <body> 　　<!--1.表单元素，用来申明数据提交范围，只有在此元素内的数据可以提交给服务器--> 　　<form action="http://www.tmooc.cn"> 　　　　<!-- <form></form> 表单意思 　　　　　　- action 表单提交的URL，申明数据提交的目标； 　　　　　　- method 指出表单数据提交的方式； 　　　　　　- enctype 表单数据进行编码的方式； 　　　　--> 　　<!--2.表单控件，用来让用户输入数据；共用12个控件，按照标签分类有2类； 　　　　2.1：input元素(9个)，之间用type属性区分 　　　　2.2：其他元素(3个) 　　--> 　　<p>账号：<input type="text" value="tarena" maxlength="12" readonly></p> 　　　　<!---readonly 只读--> 　　　　<p>密码：<input type="password"></p> 　　　　<!-- 主要属性 　　　　　　- value属性，由访问者自由输入的任何文本； 　　　　　　- maxlenght属性：限制输入的字符； 　　　　　　- readonly属性：设置文本控件只读； 　　　　　　- name 用于实现分组，一组单选框或者复选框的名称必须相同； 　　　　--> 　　<!--单选--> 　　<p> 性别： 　　　　<input type="radio" name="sex" checked/>男<!-- checked 设置默认选中--> 　　　　<input type="radio" name="sex"/>女<!-- radio 圆，radion 长方形 --> 　　</p>

　　

　　　　<!--多选-->

SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。 　　　　<P> 　　　　　兴趣： 　　　　　　<!-- checkbox ：多选 　　　　　　　　checked： 设置默认选中 　　　　　　--> 　　　　　　<input type="checkbox" checked/>看书 　　　　　　<input type="checkbox"/>打篮球 　　　　　　<input type="checkbox"/>旅游 　　　　　　<input type="checkbox"/>音乐 　　　　</P>

　　

　　　　<!--文件筐-->

　　　　<p> 　　　　　　头像：<input type="file" /> <!-- file  定义文件选择字段和 "浏览..." 按钮，供文件上传; -->  　　　　　　　　   <input type="submit" value="注册"/> <!--提交按钮 ，value 给按钮变更名称--> 　　　　　　　　   <input type="reset"> <!--重置按钮，把所有表单控件设置为最初默认值--> 　　　　　　　　　<input type="button"><!--定义可点击的按钮（通常与 JavaScript 一起使用来启动脚本);--> 　　　　</p>

 

　　　　<!--隐藏框--> 　　　　<p> 　　　　　　<input type="hidden" value="asd"/> <!-- hidden 定义隐藏输入字段;--> 　　　　</p>   　　　　<!--其他元素 　　　　　　1.label: 用来管理表单中的文本； 　　　　　　2.select：下来框创建； 　　　　　　3.textarea：定义一个多行的文本输入控件； 　　　　--> 　　　　<!--1.label: 用来管理表单中的文本,可以将文本与控件绑定在一起，增加了页面点击的受力面积;  id 是元素的唯一标识；--> 　　　　<p> 　　　　　　<input type="checkbox" id="c1"/><!--定义复选框(多选框)--> 　　　　　　<label for="c1">已阅读并自愿遵循此协议！</label> 　　　　</p>

 

　　　　<!-- 2.select： --> 　　　　<p> 　　　　　　城市： 　　　　　　　　<select><!--<select> 元素用来创建下拉列表;--> 　　　　　　　　　　<option>请选择城市</option><!--<option> 标签定义下拉列表中的一个选项（一个条目）;--> 　　　　　　　　　　<option value="1">上海</option> 　　　　　　　　　　<option value="5">北京</option> 　　　　　　　　　　<option value="3">广州</option> 　　　　　　　　　　<option value="4" selected>深圳</option><!--selected属性规定在页面加载时预先选定该选项 --> 　　　　　　　　　　<option value="2">西安</option> 　　　　　　　　</select> 　　　　</p>

 

　　　　<!--textarea：定义一个多行的文本输入控件； 　　　　　　- cols: 指定文本区域的列数； 　　　　　　- rows: 指定文本区域的行数； 　　　　　　- readonly:只读； 　　　　--> 　　　　<p> 　　　　　　简洁： <textarea cols="30" rows="5" readonly>进房间爱房管局加工费健身房圣诞节</textarea> 　　　　</p> 　　</form> </body> </html>

 

扫码关注我们
微信号：SRE实战
拒绝背锅 运筹帷幄