今天完成的事情：

布局任务14、15

准备小课堂

明天计划的事情： 

小课堂后事弄完。

提交任务14、15

准备进JS

遇到的问题： 

设计自适应导航栏的问题

想让他如何呈现，之前收固定思维影响，想的是怎么把他从某个地方变出来。这样很麻烦。

可以把他的高度设为0（max-height:0;），然后在通过transition,把他的高度拉起来.

收获：

不用bootstrap自己做一个响应式导航栏

不用bootstrap自己做一个轮播图

组块化模块化的应用

目前流行的组件库有哪些？css，js各有哪些流行的库？

1. 最流行的当属jQuery， 这货是用来做HTML元素选择操作、css和动画、事件绑定、ajax封装等所有网页基本业务的，其中很多设计特点，和方法名称，都被业内完全认可的，跟jQuery类似的库有很多：prototype，mootools，国内也有很多公司做了自己的类似的库。

2. 由于IE8以下浏览器不能兼容ES5的一些数组对象操作的方法，underscore.js 做了这些常用方法的兼容，并且扩展了大量的常用数据操作方法。 数据过滤、分组、选择、循环等等。

3. 模块化的库： 实在是多的数不胜数，最流行的当属requireJs和seaJs，比较纯粹的模块化库，此外，BAT以及其他顶级的(不顶级的)互联网公司几乎只有有一个技术能力不错的前端架构，都会有自己的库，百度的最出名的是esl，腾讯的JX，阿里系的seaJS和KISSY，等。

4. 还有一些专做图表制作的，比如业内最出名的矢量图库highcharts，百度的canvas图库echarts等。

5. js进行复杂的HTML拼装的时候。可能需要使用js模板引擎，这样的库也是数不胜数，handlebars，Mustache，jade等

6. 框架： 以前的backbone、canjs，现在的angular等

经常遇到的浏览器的兼容性有哪些？原因，解决方法是什么，常用hack的技巧 ？

1. IE6不支持png-24透明图片

在IE6浏览器上，使用png24为的图片不透明，出现背景。

解决方法：图片使用gif格式，或者png-8格式图片。

2. 3像素问题

解决方法：对另一个div也使用float;

3. 浏览器默认的margin和padding不同

解决办法：引入normalize.css  通配符就不要用了，影响浏览器渲染速度。

4. IE5-IE8不支持opacity

IE5-IE8不支持css属性opacity

解决方法：这时可以另外添加ie滤镜alpha

5. IE6不能定义1px左右宽度的容器

IE6及其更低的版本

创建一个高度为1px的容器，在IE6中没效果。

解决方法：因为行高line-height在IE6下有默认值，设置 line-height:1px|overflow:hidden|zoom:0.08.

6. IE6不支持min-*:

IE6不支持min-height属性。即使定义了元素高度，如果内容超过元素的高度，IE6在解析时，会自动延长元素的高度。

解决方法：利用IE6不识别！Important，给元素设置固定高度，并且设置元素高度自动。

7. 双外边距浮动问题：IE6及其更低的版本。

问题描述：块属性标签float后，又有横行的margin情况下，在IE 6显示margin 比设置的大。

解决办法：将元素的display属性设置为inline，因为元素是浮动的，所以这么设置

进度：task14、15

任务开始时间：2018.6.18

预计结束时间：2018.6.20

是否有延期风险：无

禅道：http://task.jnshu.com/zentao/project-task-687.html