今天完成的事

                  1   任务7的深度思考

             2    任务7遇到的困难

            3   任务8   9 的知识点学习

        1.1

              什么是css  sprites？

                   css  spries  是雪碧图   也叫精灵图， 好处优化速度加载快，缺点  图片都在一起  不好修改 其中的一个  不好维护

              什么是浮动？  有哪些清楚浮动的方法

                       一句话及时脱离文档流 ，向左向右 浮动  不服从管教了！  清楚浮动的方法     1 clear    2  overflow  3

               rgba和opactiy的透明方式有什么不同？  dispay和visiblty有什么区别

                          1   rgb和opaciy的   哟什么不同    rgb的方式只透明  你设置的 那个    别的不收影响   opacity的事整个方式都透明掉

                          2    disoay个visibly有什么不同     dispay是用来隐藏元素的  及时把这个元素给删除了   visibly是用来透明的

               描述下 z-index和  叠加上下文是如何形成的  

                             w3school给出的定义是：z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。

                             正z-index>z-index:0/auto>inline/inline-block盒子>float盒子>block盒子>负z-index>background/borde

               如果是在手机上 查看 投票也  灭有hover效果 是怎么 班

                            只能添加  点击事件了

        2.1   任务7中遇到的困难

               在投票页时  那个点击播放音频是不好做，最后百度了一下，可以用  透明度实现   把 播放控件凡在  那个播放图标上面    然后播放控件透明掉

            3.1   任务8新的知识点

                bootstarap的布局

                动画

                自适应

                定宽

                不定宽

            3.2  bootstarap的布局

            简介： 是一种css 前段框架 ， 有好多写好的样式  比原生的好一些

                 使用： 

             引入

                      这个就行， 然后官网  找到要用的 组件就

                  boostsrap的布局学习

                    1   全称也叫栅格系统

                    2   用途 主要是用来  做响应式  布局用

                    3    基础的知识点

                             容器    container    行  row     列 col    

                             col-xs    屏幕 小于  768时

                             col-sm    屏幕大于    768时

                             col-md    屏幕大于     992时

                              col-lg       屏幕大于  1170时

                     4  布局的基本用发

                            代码

                       效果

                 5   响应式的中级用法

                             需求 ：当小屏幕的时候  内容占一整行   大屏幕时占一半

                      代码

               效果

                    小屏幕

                 中屏幕

   3.3 动画

         学习目标  学习   css的高级用发     用css   做出来  动画的效果来

        学习的知识点

       选择器

       框模型

       背景和边框

       文本效果

       2d和3d

       动画

       多行布局

       用户界面

         边框       圆角边框        阴影边框       图片边框

                  圆角边框    border-radius         如图1

                  阴影边框    box-shadow            如图2

                  图片边框    border-image          如图3

             代码

                效果

                 背景 没图片看不了  不看了  前面已经学过了

            文本效果

                      文本阴影      图1

                      文本自动换行   图2

         文本字体任字体 

                  font-family  ：‘宋体’，用那个欢那个

          2D 旋转

               代码是  transform：rotate（30deg）；顺时针专30度    图一

          移动

                transform：translate（50px，100xp）；   如图二

                    则是2d效果看这不砸第

         3d 过度

               就是那个一种转态变到另一种状态  需要的时间

              语法 transition：width 2s ，heiht 2s，transform2s；

            代码

           动画

   自适应： 前面已经学过了

   定宽和不定宽  就是定宽度吧 没啥学的哦

  任务9   

         我发现任务 8   9   好像是一样的哎   一块做吧！

       新知识点

       媒体查询

        语法   

@media screen and (max-width: 300px) {
    body {
        background-color:lightblue;
    }
}

   当屏幕像素 小于 300后  要做改变的样式

    @media screen and (min-width: 300px) {
        body    {
           background-color:lightblue;
       }
    }

       当屏幕像素 大于 300后  要做改变的样式

明天计划的事  完成任务  8   9