09.项目-制作项目首页的Header和Tabbar区域
步骤1：在项目根组件 App.vue 里面，分三部分
第一部分：<!-- 顶部 Header 区域 -->
第二部分：<!-- 中间的 路由 router-view 区域 -->
第三部分：<!-- 底部 Tabbar 区域 -->
步骤2：App.vue 展示到页面上
1、在 index.html 的容器里面，需要把 App.vue 放进去
2、在 main.js 里面 ，渲染 App.vue 这个根组件
也就是说通过挂载 id ，渲染 App.vue 这个根组件，把 App.vue 放到 index.html 的容器里面
制作项目首页的Header
以后在做项目的时候，我们要有偷懒的精神，先看看或问问是否有现成的！
Mint UI官方地址：https://mint-ui.github.io/#!/zh-cn
进入官网--->开始使用--->中文（Vue 2.0 版）
command + f ，搜索 Header，回车
左侧的 Header 点击进去可看具体的代码实现
右侧的 Header 点击进去可看预览手机效果
要使用 Mint UI 的组件，需要按需导入 Mint-UI 中的组件
在 main.js 、App.vue 里面，分别复制粘贴，写入如下图代码：
Header就被固定定位了，它不占标准流了，所以叠在上面了
我们点击如下图，右上角的图标，然后把鼠标放在 Header 上面，
我们可以看到 Header 的高度为 40 像素
然后在 App.vue 里面添加一个样式，它就会被挤下来
更新中。。。