（三）完成页面布局——vue-cli3实例：电商分类网页

在页面.vue中

#在<template>标签中通过<div>进行布局，设定相应的class名称

#在<style>标签中设置样式

每个浏览器的默认样式都不同，所以一般都将默认值改为0

*{
        padding: 0;
        margin: 0;
    }

#在component文件夹下建立每一个布局的内容组件（组件名开头为大写，如Left.vue）

 

#在页面.vue中的<script>中引用组件

import Left from '../components/Left.vue'
    export default{
        components:{
            Left
        }
    }

在<template>中通过标签引用组件，如 <left></left>