今天学到的东西

       1  botstrap   

       2  删格系统

       3  css spirt    雪碧图

一。

    botstrap 介绍以及使用

        介绍

               BootStrap 是Twitter的工程师开发的前端框架，可以非常方便的设计出好看的页面效果。 

       如何使用

              首先下载  bootstap  插件  然后在按顺序引入    顺序不能乱

                  jquery.min.js

                  bootstrap.min.css

                  bootstrap.min.js

二。

    删格系统

      作用     运用Bootstrap的栅格系统，可以做出像table那样定义多少行，多少列效果，但是又比table灵活。

      使用方法

          <div class="container">

              <div class="row">

                   <div class="col-xs-6 ">一共12列</div>

                   <div class="col-xs-6 ">一共12列</div>

             </div>

          </div>

      介绍

           col    声明 列设置

           md     设备  宽度代码        <768超小屏幕xs        >=768小屏幕sm        >=992中屏幕md        >=1200大屏幕lg

           div    占多少空间

三。

   雪碧图

      介绍 

           可以把很多的小图标放在一张图上 使用 背景定位 来显示使用哪个图    优点可以快速加载页面减少服务器压力

           原理  所有的图标放在一张图上   创建大小和图标一样的盒子   改变背景图像位置来显示不同图标    

      使用方法

           首先图标合成

              https://www.toptal.com/developers/css/sprite-generator   在线图标合成器

           使用

              .icon{

                     width: 32px;

                     height:32px;

                     background:url()  no-repeat 0  0;

                     display;  inline-block      变成行元素

                }

    明天计划的事

        试着做一下任务5

             下面是任务  4  的修改版     师兄看一下