4.1.form和input

<!--form标签表单标签，块级元素，会自动换行将数据传输给服务器常用属性：action  表单提交的地址urlid 		唯一标识name    名称target  表单提交打开方式（默认当前窗口）method  提交方式get请求（默认）参数会跟在url地址栏后面，用问号拼接安全性差，传输的数据量小，效率高（速度为post的两倍），有缓存post请求参数不会跟在url地址栏后面，会放在请求体中安全性高。传输数量大，速度相对较慢，无缓存--><form action="#" method="get" id="myform" name="myform"><!--表单元素需要设置name属性值，否则数据无法传递！！！input元素type    表单元素的类型text 文本框passage 密码框radio 单选框（需要设置一组相同的name属性值）checkbox 复选框（需要设置一组相同的name属性值）button 普通按钮hidden 隐藏域（用来存放需要传递给服务器，但不需要显示的数据）file 文件域（上传文件）date 日期框submit 提交按钮reset 重置按钮image 图片按钮（提交按钮）value 	表单元素的值checked 是否选中（单选框 复选框）disabled 是否禁用maxlength 允许输入的最大字符-->编号：<input type="hidden" name="UserId" value="1"><br>姓名：<input type="text" name="UserName"><br>密码：<input type="password" name="UserPwd" maxlength="6"><br>性别： 男<input type="radio" name="UserSex" value="man">女 <input type="radio" name="UserSex" value="woman"><br>爱好：唱<input type="checkbox" name="UserHobby" value="sing">跳<input type="checkbox" name="UserHobby" value="dance">rap<input type="checkbox" name="UserHobby" value="rap">生日：<input type="date" name="UserDate"><br>头像：<input type="file" name="UserHead"><br><input type="button" value="普通按钮"><input type="submit" value="提交按钮"><input type="reset" value="重置按钮"><input type="image" src="img/bd.png"></form>

效果如图：

 4.2.textarea、label和button（button与input里按钮相同，在HTML5里增加了这一块内容）

<!--textarea文本域cols和rows来规定textarea的尺寸cols规定区内的可见宽度rows规定区内的可见行数label标签设置label标签的for属性值与表单元素的id属性值相对应，当点击label标签时，会自动给表单元素聚焦button按钮type类型button普通按钮submit提交按钮（默认）reset重置按钮-->简介：<textarea cols="10" rows="5">我是练习时长两年半的个人练习生</textarea><br><label for="UserName">姓名</label>:<input type="text" name="UserName" id="UserName"><br><button type="button">普通按钮</button><button type="submit">提交按钮</button><button type="reset">重置按钮</button><br>

效果如图：

4.3.select 

 

<!--select下拉选项<select name=""><option value="值">文本</option><selsect>注：当option设置了value的属性值时，提交的数据是value对应的值如果未设置value，则提交的是文本值常用属性value 设置值selected 设置选中状态-->城市：<select name="city" multiple="multiple" size="4"><option>请选择城市</option><option value="BeiJing" disabled="disabled">北京</option><!-- multiple是多选，disabled是不让其选择--><option value="ShangHai">上海</option><option value="ZhengZhou">郑州</option><option value="ShenZhen">深圳</option></select>

效果如图：

 5.1.常用字符实体

<!--字符字体<		  &lt>		  &gt空格		  &nbsp版权符合   &copy-->&lth2&gtHello &nbsp&nbsp&nbsp&nbsp&nbspword&lth2&gt&copy百度

效果如图：