今天完成的事情： 
完成了任务6

1，完善了任务6head部分里面三个下拉菜单的细节，覆盖掉bootstrap的默认样式，使之符合UI图
2，成功养成用chrom的开发者工具增减代码来观察页面变化的习惯。。。。确实方便很多，而且bootstrap的默认样式在开发者工具里面能看到，css代码里面看不到。。不用不行啊
3，之前的footer部分的小图标没有使用雪碧图，等于说昨天还是没搞清楚雪碧图的原理，今天main部分必须要用雪碧图，研究之后成功使用了雪碧图制作了main内容
4，权重！权重！imrportant，虽然还不能完全熟练分辨各标签的权重，但是在bootstrap的折磨下也算有一点心得。

明天计划的事情：
着手做任务7，先弄清楚任务7要实现的效果，然后拆分各模块的功能，构思出整体框架，再学一点新知识。

遇到的问题：
一：
优化head下拉菜单的时候，遇到很多小问题基本上分为两类，一是由于下拉菜单是引入的是bootstrap样式的原因导致有很多默认样式需要修改，二是任务6更为复杂的布局（现在看来也不复杂）导致一时没想明白父子元素的关系，在写css代码上走进了死胡同。
1，引入bootstrap样式之后，会多出很多默认的定义，像之前的任务那样在编辑器上修改代码然后刷新网页观察css定义的变化明显不行了，根本就找不出来css代码的增减对页面有哪些影响，而且bootstrap默认定义的优先级还比较奇怪，权重有时高有时低，当然这是不熟悉各个标签权重大小导致的，所以通过chrome开发者工具直接来编辑代码是非常有效且便捷来观察页面具体变化的手段，比如这么一长段定义里面，task6是我自己写的css代码，bootstrap.min.css:5是bootstrap的默认样式，这个只能通过开发者工具看到。
所以之前的任务师姐都习惯用开发者工具来调试代码而我不习惯，从任务6之后我也得习惯这种方法，它确实也很好用。

去除button的时候用到了outline：none标签，但是按钮仍然有一个阴影的效果，这是footstrap复杂性的又一个表现，自己写的按钮只有outline而没有shandow效果，而引入的样式会有更多的效果，所以还需要加一个box-shandow：none 标签，不仅仅是footstrap，可能后面的jquery也是同样的，这是需要留意的地方（虽然没有用过js跟jquery但是感觉应该是这样）。


修改downdrop样式的时候学到了min-width这个标签的用法

这就是设置drop内容的宽度与button的宽度保持一致或者略小，这样页面看起来会美观一点。
这个设置也要分辨清楚父子元素的联系。

弄清楚原理之后其余的都是小问题，在修改bootstrap默认样式浪费了很多的时间，所以正确的方法能显著提高效率。
2，以前的任务都比较简单，不会出现也没有必要用到 比如：弹性盒子套弹性盒子，弹性盒子套按钮和下拉菜单，这里主要是要反思一下相对复杂的结构里面的父子元素联系的问题。例如，父子元素都有固定的宽度，那就直接定义width：xx，这个不会出现冲突。当给父元素div1设置width：30%的时候（父元素处于弹性盒子box1 “假定宽度为100px”里面），他的子元素div2宽度设置成百分比width：30%，那么div1的宽度是30px，div2的宽度是9px。之前过于执着于在网页中寻找页面的变化，而没有重视html代码中的结构，父子元素没有弄清楚，我以为div2的宽度也是30px，还调试了半天其他代码，浪费了很多时间。

以上的问题都是思路上的问题，有些坑解决之后看起来很低级，但是只有自己被卡在上面了才会明白这些坑的重要性！以及更深刻理解他们的原理。

二：
关于main部分的雪碧图，再再再次认真研究了雪碧图相关文章之后，我发现我以前一直忽略了一句话

 1）需要一个设置好宽和高的容器

按照我之前的理解，雪碧图就是background-img，就是插入背景图，background-position 定位就是相对他的父元素来确定x，y的位置。
现在深刻记住 1）需要一个设置好宽和高的容器 这句话之后，插入背景图是相对于这个设置好的容器而言的，定位也是相对于这个容器，至于雪碧图的定位，是通过修改这个容器的位置来实现的。此时，我终于明白了之前总出问题的原因，父级元素的样式不相同，插入的image大小也不相同，所以给background-img设置大小，定位都很麻烦，现在给他套上一个容器，父子元素关系明确之后就好办了，一级管一级，在清晰的逻辑指导下，background-img的大小，位置能做到指哪打哪。

设置雪碧图大小的时候在任务6的坑乎上看到别人 http://kenghu.jnshu.com/k/question/1246 的问题，心有戚戚焉，就学会了 transform: scale(）属性。使用此标签导致的位置变化可以通过设置盒子的参数来搞定。

收获：