任务四总结

今日完成：复习了之前的笔记和昨天没弄懂的一些地方，百度了一下

笔记：

input标签外是否添加form标签需要按情形区分：

应用场景的区别：

1.所有向后台提交数据（包括原生和ajax提交）的input都建议用form包裹，

2.如果只是用来做前台交互效果则不推荐使用form包裹。

但提交数据时，其实也可以不用form包裹input标签：

1.如果有form标签，在点击提交铵钮时，浏览器自动收集参数，并打包一个http请求到服务器，完成表单提交。在这一过程中，浏览器会根据method的不同，将参数编码后，放在urI中(get)，或者放在请求的data中(post)。然后发送到服务器。

2.如果没有form，post方式的提交要使用ajax手工完成。get方式的提交需要自己拼接url。

========================================

form在网页中主要负责数据采集功能。

一个表单有三个基本组成部分：

（1）表单标签：包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。

（2）表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。

（3）表单按钮：提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入。还可以用表单按钮来控制其他定义了处理脚本的处理工作。

========================================

form属性

form 属性规定文本区域所属的一个或多个表单。

form 属性是 HTML5 中的新属性。

语法：<textarea form="form_id">

关于margin：auto 只能实现块状元素水平方向居中  默认上下为0

Auto属性是剩余空间

margin-top会经常出现bug，所以推荐只在兄弟元素之间使用margin，而在父子元素之间使用padding；

关于Margin-left或是Margin-right 与float:left同时使用时，在IE6会有双倍距的bug。

解决方案：在同时使用这两个参数的地方加 display:inline

Margin：0 1rem 0 auto； 也可实现靠右，和右浮有什么区别

答：最大的区别是右浮脱离文本流，这样可以和前面的元素并列在一排

使用Margin如果是块状元素，需要占满一行，如果想和其他元素在同一排，需要其他元素浮动

           如果是行元素，行元素加好宽度后，它的auto也是直接为0，可能是默认，无法靠右

总之，简单的靠右，右浮看起来要比margin和定位方便的多

任务四的深度思考5：

fixed属性布局的时候由于手机的原因会出现很多问题，比如说手机端底部固定一块，然后里面有输入框，（类似于手机QQ或者微信底部的输入框一样的布局）这个时候在调用软键盘的时候会出现软键盘遮挡输入框的情况

解决方法：将原body滚动区域移到main内部    

Main元素加：-wekit-overflow-scrolling：touch  /  overflow:auto;  使得滑动流畅

Auto:手指离开立刻停止滚动

Touch：手指离开，保持一段时间滚动

明日计划：实现任务五

遇到问题：今天的笔记都是遇到的问题，通过百度解决了

收获：好多标签没见过，一点点的认识了