今天完成的事情：

        用sprite图和background的配合把它应用到页面上，合成的图片大小比之前没合成的要小一半，确实挺好的。

        增加了文本出现省略的功能。

        对页面规范了下一些代码。
        重温了一些css方面的基础列如伪类和伪元素。

明天计划的事情：

        继续做下一个任务，先把下个任务涉及到的知识点熟悉学一学，再做任务7。

遇到的问题：

        用bootstrap做的下拉栏无法根据屏幕宽度很好的分布，后来直接用position定位搞定了。

        刚开始没用雪碧图，用上去后，发现对html页面的改动稍微大了点，所以就把雪碧图的两列图标用ps修改成一列，这样就可以原样贴上去，只需修改一下大小和位置。 

收获：

        1.head头引入css和js都有顺序的，不单单是bootstrap框架，对bootstrap样式的修改的样式表一定要放在bootstrap样式表的后面，因为html的读取顺序是从上而下的，不过对于body内的引用的类是从左往右的顺序，所以如果要对原先标签内引用的类做覆盖的话，一定要放在被覆盖类的后面才行。

        2.z-index原来可以使用负数，在z轴上使其靠后。

        3.Input和Button都差不多，不过后者最酷的功能就是我们可以在其内部放置一些有用的HTML元素。

        4.文字本身就有撑开元素的属性。

        5.会脱离文档流的有float、fixed和absolute，如果子元素中有使用这三个定位则父元素不会被撑开，可使用clear:both清除浮动。

        6.float和绝对定位的不同处：使用float脱离文档流时，其他盒子会无视这个元素，但其他盒子内的文本依然会为这个元素让出位置，环绕在周围。而对于使用absolute positioning脱离文档流的元素，其他盒子与其他盒子内的文本都会无视它。

        7. 代码规范很重要，例如父元素和子元素的空格数，后者一定要比前者多，这样才能体现哪个元素包含哪个，简洁明了，就像书的目录一样，还有属性在能缩写的情况下尽量缩写，因为这样编写才会更简洁、更具可读性的样式表，节省时间和精力。

        8.注意伪类也可以用类选择器，比如类red，则可以.red：nth-child{}

        9.关于box-sizing属性布局：

                     box-sizing:content-box是标准盒模型，CSS定义的宽高内只包含content的宽高

                     box-sizing:border-box是IE盒模型，CSS定义的宽高内包括了content，padding和border

       10.关于github上面的子文件夹是灰色的问题？是因为子文件夹下还有不是本仓库的git仓库，删掉就好了，它是隐藏文件夹，所以要设置文件夹选项的隐藏文件可见性，