效果图：     主要通过鼠标悬停到上面 进入transform动画的缩放以及 移动 然后给其增加阴影 显示出层级感  HTML部分使用四个li 在里面用h4以及p标签进行文字书写  对他进行一个浮动    这里我们不使用边框 使用box-shadow 给每一个li增加阴影 比较有层级感 按钮中的文字也做一个阴影   这里给使用nth-child  来给每一个按钮设

  效果图：       这里我们主要使用tab切换时 通过增加类以及我们需要一定的动画所用animate来实现效果更加方便   tab栏区域 以及底部的白色线条 我们设置在同一个div当中 通过弹性布局的实现  当然因为底部白色线条需要跟随点击进行移动 所以我们需要通过定位的方式来操作点击切换的背景 可以单独设置两个不同的盒子 通过定位的方式 一个向左一个向右 设置移出去 前提给父元素设置溢出隐

      效果图：   当页面加载时 自动获取到相对于的数据 在页面加载完成 自动渲染出来    给每一个进度条的分数区域设置一个value 或者文本值 可以让我们通过jQuery来获取到需要的数据      这里我们遍历每一个div之前 先尝试一个是否可以获取到 val值 并打印出来      结果是没问题的     这里有

    效果图：      移入前           移入后：     主要通过css设置不同的排版 以及当鼠标移入移出时 背景颜色以及图片进行一个动态的变化      写入四个li 进行浮动设置 给每一个li都设置成相对定位         因为顶部的图标需要通过绝

   文字下滑线 这个效果通过给行内元素设置背景颜色 然后使其定位到文字靠右底部  初始宽度设置为0 高度为3          然后我们通过鼠标移入到文字上是 将宽度设置为100% 从左向右进行填充 需要注意的是 使用过渡动画时 需要设置指定的 

   主要使用 定位 overflow 加伪类进行动态遮罩层的移入移除，当鼠标移入移除时更改给遮罩层设置的bottm方向的值 使用过渡动画 让效果更加顺滑

      效果图：    html部分 分为三块 图片区域 文字区域 按钮区域 由于都在一个位置上面 所以我们要给最外层的盒子增加一个相对定位   让其子元素 设置绝对定位  设置在需要的位置  当图片为展开时 将boxTxt隐藏  为了使盒子有过渡 可以给boxCover添加过渡动画     点击后增加的cur样式设置：.boxCover.cur .boxTxt

  一 . 路由的跳转方式2种： 通过标签：<router-link to='/login'></router-link>    <router-link to="/login">登录</router-link>    <router-link to="/register">注册</router-link> &

        通过css3 使用定位加hover 完成导航栏的颜色移动      效果图：   将导航栏需要的标签以及移动的背景设置都放在一个盒子中   给box设置相对定位   给active设置绝对定位  宽高跟标签宽高相同         记得给a标签设置一个相对定位 x-inde

      一.通过$route.params的路径方式var User = { template:"<div>用户：{{$route.params.id}}</div>"} var myRouter = new VueRouter({     //routes是路由规则数组   &n